• 목록
  • 아래로
  • 위로

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

제목-없음-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. (23%) 836210/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 947
공지 [중요] 호스팅 만료와 관련하여 일부 수칙이 변경됩니다. 4 마스터 23.01.14.02:23 4622
공지 [필독] 질문하는 방법 17 마스터 18.02.23.03:09 4479
846 imgur 사용하시는분.... 잘아시는분...질문! 5 홀민 19.08.18.22:08 491
845 Imgur 업로드 플러그인 사용해보신 분 계시나요? (차단 관련) 8 이니스프리 17.11.12.17:05 516
844 index 파일은 어디에 넣어야 되는걸까요? 3 모여라꿈동산 21.11.22.08:44 229
843 infinity free무료호스팅 사용중인데 ftp연결을 거부합니다 9 image 손가락개 20.09.10.13:57 329
842 Input submit 버튼 2 260578 19.01.20.18:44 214
841 Jquery 사용 시 $(window).load( function() 를 사용하시나요? 5 로우지 19.08.20.03:15 209
jquery가 서버에 올리면 적용이 이상하게 됩니다. 6 image 국내산라이츄 17.08.24.11:59 501
839 JS 반복 처리에 대한 로컬저장문제와 PHP의 Request의 비동기처리 2 Hanam09 19.10.20.23:10 220
838 JSP의 장단점에 대해 질문 드립니다. 21 이니스프리 20.06.09.21:42 219
837 Let's Encrypt SSL 인증서 갱신이 안됩니다. 1 HighSpeed 21.04.16.17:29 150
836 Let's Encrypt 6 image title: 투명 아이콘ㅁㅁ 17.10.13.17:09 262
835 Liberty Skin 대제목 관련 질문 3 image sweetenpotato 20.04.06.01:49 209
834 Linux 시스템 보안에서 실무 등에서는 어떤 보안 솔류숀을 사용하는지 궁금해요 1 Seia 19.04.05.23:00 224
833 ls는 됫는대 압축풀기가 안되내요 ㅜㅜ 핫슈 20.06.16.21:15 42
832 LTE 폰에서 3G 수신감도 확인방법?? 8 이니스프리 22.05.01.20:42 504
831 Mac OS 80포트 여는방법 12 루콤스튜디오.. 18.06.03.21:13 857
830 Mac 입문! 10 갱생협스 20.12.27.22:31 189
829 MS 오피스 365와 MS 오피스 2016(단품 패키지)의 차이는 무엇이고 어떤 것을 추천해주시는가요? 9 image 이니스프리 18.03.29.13:33 1437
828 MXexception (?) 오류가 뜹니다. 1 title: 맛스타의 자물쇠에듀 18.07.03.18:39 193
827 MySQL 실행이 안됩니다. title: 황금 서버 (30일)하루살이 17.01.28.11:55 428