• 목록
  • 아래로
  • 위로

회사 홈페이지 건이라 캡쳐는 못 하고 대충 어떤 양상인지 그림을 만들었습니다만... 

제목-없음-1.jpg

원래 이렇게 나와야 하는 게 

 

제목-없음-2.jpg

이렇게 나오는 상황입니다. 

 

<div class="section main"> 
<div class="sectionIn"> 
<div id="fullbanner">
<div class="goods">
<p class="img"><img src="../images/main/이미지" alt="설명"></p> 
<div class="text">
    <a href="#floatwindow" class="open" style="decoration:none; color:#494949;"><h2 class="tit"><strong class="pointC">링크</strong></h2></a> 
    <p class="conts"> 설명문</p> 
</div>
</div>
</div>
    <div id="floatwindow">
<a href="main.jsp" class="close">Close</a>
<dl>
<dt>New product arrived!</dt>
<dd><img src="/images/main/IMpopup_2.jpg" usemap="inno"></dd>
<map name="#inno">
<area shape="rect" alt="" title="" coords="145,74,270,93" href="링크" target="_blank" />
<area shape="rect" alt="" title="" coords="314,72,440,92" href="구글" target="_blank" />
</map>
</dl>
</div>

이게 HTML(문제가 되는 부분은 초록색)

 

/* Main pop-up */
#floatwindow {display:none; position:absolute; top:150px; right:450px; width:640px; height:auto; border:none;z-index:9;}
#floatwindow a.close {position:absolute; right:20px; top:5px;}
#floatwindow a.close img {border:none; width:25px;}
#floatwindow dl {width:100%;height:100%;background-color:#fff;margin:0; text-align:left;}
#floatwindow dl dt {height:40px; line-height:30px; text-indent:1em; color:white; font-weight:bold; cursor:move; color:#002f82; background-color:#bdd7ee;}
#floatwindow dl dd {margin:0; padding:1em; line-height:1.5; text-indent:1em; margin-right:1.5em;}

이건 CSS입니다(문제가 되는 부분은 빨간색)

 

<script>
$(function(){
    $("a.open").click(function(){
        $("#floatwindow").fadeIn("fast");
        return false;
    });
    $("#floatwindow a.close").click(function(){
        $("#floatwindow").fadeOut("fast");
        return false;
    }); //여닫는 스크립트. window 관련입니다. 
    $("#floatwindow dl dt").mousedown(function(e){
        $("#floatwindow")
        .data("clickPointX",e.pageX-$("#floatwindow").offset().left).data("clickPointY",e.pageY-$("#floatwindow").offset().top);
    $(document).mousemove(function(e){
        $("#floatwindow").css({
            top:e.pageY-$("#floatwindow").data("clickPointY")+"px",left:e.pageX-$("#floatwindow").data("clickPointX")+"px"
        });
    });
    }).mouseup(function(e){
        $(document).unbind("mousemove");
    });//창 이동과 관젼된 스크립트(창이 크기를 줄였음에도 좀 커서 부득이하게 추가한 기능)
}); 

</script>

이건 jquery입니다.

 

jquery 소스에는 이상이 없고, 현재 문제가 되는 건 floatwindow가 클릭 전에는 display:none;이어서 안 보여야 하는 게 맞는데, 서버에 올렸을 때 야래 그림처럼 보인다는 겁니다. 확인했는데 저렇게 돼서 급 서버 내렸네요... 참고로 이클립스에서 저 코딩하고 localhost를 통해 확인했을 때는 크롬 파폭 둘다 잘 됐었습니다. (이클립스 내부 브라우저는 아래 그림처럼 보이다가 위 그림처럼 표시됩니다)

작성자
국내산라이츄 102 Lv. (15%) 834930/848720EXP

인생은 양자역학이외다

댓글 6

NoYeah
profile image
로컬 테스트 환경과 서버의 환경이 똑같은 상태였나요?
comment menu
2017.08.24. 14:13

신고

"NoYeah님의 댓글"

이 댓글을 신고 하시겠습니까?

국내산라이츄 작성자 → NoYeah
profile image
'ㅁ' 그걸 확인 안 했네요... 카페24긴 한데..
근데 거기가 제이쿼리가 듣기는 하는 게 원래 제이쿼리 플러그인이 있었는데 그거 빼버렸어요..
comment menu
2017.08.24. 18:51

신고

"국내산라이츄님의 댓글"

이 댓글을 신고 하시겠습니까?

NoYeah → 국내산라이츄
profile image
할 ㅋㅋ
원인은 가까이에
comment menu
2017.08.24. 21:00

신고

"NoYeah님의 댓글"

이 댓글을 신고 하시겠습니까?

프요
저 화면이 저렇게 나오는 건 CSS 쪽 문제 아닐까요 ..? 캐시삭제 같은 거 한번 해보심이...
그리고 회사 링크랑 구글 독스 링크는 지우시는 게 좋을 거 같아요 :D
comment menu
2017.08.24. 23:20

신고

"프요님의 댓글"

이 댓글을 신고 하시겠습니까?

신고

"국내산라이츄님의 댓글"

이 댓글을 신고 하시겠습니까?

프요 → 국내산라이츄

저는 아무것도 못봤습니다ㅎㅎ

 

 

comment menu
2017.08.24. 23:43

신고

"프요님의 댓글"

이 댓글을 신고 하시겠습니까?

권한이 없습니다.
번호 제목 글쓴이 날짜 조회 수
공지 [작업 완료] 설 명절 맞이 서버 업데이트 안내 3 마스터 24.02.11.17:21 871
공지 [중요] 호스팅 만료와 관련하여 일부 수칙이 변경됩니다. 4 마스터 23.01.14.02:23 4547
공지 [필독] 질문하는 방법 17 마스터 18.02.23.03:09 4479
925 계속 사용중이던 네트워크 공유 폴더가 갑자기 액세스 불가라고 뜹니다. 6 image 장윤서 18.06.07.16:55 34346
924 팀뷰어 대체할 원격 제어 프로그램 추천 부탁드립니다 16 이니스프리 17.11.30.15:38 32327
923 엑셀 그래프의 축 간격 조절 문제입니다. 2 image 국내산라이츄 17.08.10.11:06 12499
922 아이폰/아이패드 충전기 발열 관련 질문 드립니다 9 image 이니스프리 19.05.02.22:52 11116
921 PyQt 실행시 프리징 현상 관련하여 질문 드립니다! ㅠㅠ 3 이니스프리 19.07.06.03:37 6716
920 에러 523 해결법 4 입체그림 20.02.21.16:48 6713
919 프린터가 지 맘대로 프린트를 하네요. 3 곰도리푸 18.04.04.18:20 6073
918 윈도우용 메일 클라이언트가 필요합니다. 9 네모 18.01.11.20:15 5867
917 크롬에서 특정 사이트 접속 문제 관련하여 질문 드립니다 9 이니스프리 17.03.27.18:03 5327
916 오라클 클라우드 프리티어 가입이 안 되네요 ㅠㅠ 20 이니스프리 20.06.26.21:31 4847
915 파이썬 에디터로 어떤 것이 좋나요? 14 NoYeah 20.01.08.21:08 4534
914 라떼판다와 라즈베리 파이 중 어느 쪽을 사는 게 나을까요? 9 제르엘 18.10.14.19:25 3837
913 나무 위키의 수익구조는 무엇일까요? 2 NoYeah 18.03.18.15:56 3837
912 파티션 복구 프로그램 TestDisk 잘 아시는 분 계시나요? 29 이니스프리 17.11.10.14:53 3749
911 IE11에서 이미지가 깨지는 현상을 해결할 수 있을까요? 2 이니스프리 19.08.02.00:01 3705
910 파일질라로 연결하니까 보안되지 않은 서버입니다. TLS를 통한 FTP를 지원하지 않습니다. 이렇게떠요 해결방안좀 1 마카오 16.09.11.00:57 3658
909 자바스크립트 FormData와 관련된 메서드의 IE 호환성과 관련하여 질문 드립니다 ^^ 6 image 이니스프리 19.08.05.14:22 3433
908 선택약정 안 되는 중고폰의 경우에는 어떤 단점이 있는 것인가요?? 6 이니스프리 20.01.21.14:30 3103
907 [Requests] multipart/form-data의 전송에 대해 질문 드립니다 ^^ 4 이니스프리 19.12.18.22:00 3021
906 집에서 시놀로지 NAS로 워드프레스나 미디어위키 돌리면 느릴까요? 10 이니스프리 17.01.16.20:56 2986