반응형



팝업창 띄우기] 팝업띄었을 적, 이미지 여백없애기



회사에서 업무로 인해서 페이지에 팝업창을 띄우는 걸 해야 했습니다...


팝업창 띄우는 것은 쉬웠지만 그 안에 이미지에 왜 여백이 생기는 것인지...


팝업창 해결하려고 하다가 시간이 너무 지체되어서 다음날로 넘기고, 또 넘기고


3일간 간간히 팝업창에 의해서 괴롭힘을 당했네요.ㅜㅜ


오늘은 기필코 팝업창을 완료 짓겠다는 심정으로 여백을 없애려고 했는데, 결국엔

알아내게 되었습니다. 으하하하하하


정말 간단한거였는데.ㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜ



해결방법은 아주 간단했습니다.


먼저 팝업 소스 안에 이미지를 바로 집어넣은 방식으로 사용했는데, 이 경우 이미지가

뜨긴하지만 주변에 여백이 들어감으로 인해서 본인이 원하는 디자인이 나오지 않게

됩니다.


해결방법은 새로운 페이지를 만들어서 그 안에 테이블을 넣고, 이미지를 넣어줍니다.

그리고 나서 팝업창 소스에 들어가 있는 이미지 주소를 제거하고, 새로운 팝업창

페이지 주소를 넣어주게 된다면 해결은 됩니다.



body.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>


<style>

*{margin:0; padding:0; border:0; width:100%; overflow-x:hidden;overflow-y:hidden;}

</style>


<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Untitled Document</title>

</head>


<body topmargin="0" leftmargin="0" onunload="popup();">


<script language=javascript>

<!--

function popup(partner)

{

window.open("http://am-119.kr/images/event_sample_cafe.jpg", "샘플신청", "top=150, left=150, width=400 ,height=150" , "resizable=no, scrollbars=no, location=no,menubar=no, status=no");

}

popup();

-->

</script>


aaaaa

</body>

</html>




popup.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>샘플신청 완료</title>

</head>


<body topmargin="0" leftmargin="0">

<table width="400px" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="400px" height="150px"><a href="http://cafe.naver.com/chaga911/" target="_blank"><img src="http://am-119.kr/images/event_sample_cafe.gif" width="400" height="150" border="0" /></a></td>

  </tr>

</table>

</body>

</html>


반응형
블로그 이미지

-_________-0

IT&모바일, 영화&연극 등 문화 리뷰, 데이트코스/블로그 마케팅에 관한 블로그

,