2011-09-12 4 views
0

나는 colorbox 모달에 div를 추가하려고하는데, 내가 한 것은 CSS 설정을 'overflow : visible'으로 설정하고 jquery.colorbox의 모든 문자열을 변경하도록 설정했기 때문입니다.컬러 박스 오버 플로우가 여전히 숨김으로 설정되어 있습니까?

<div id="colorbox" class="" style="padding-bottom: 0px; padding-right: 0px; display: block; position: absolute; width: 796px; height: 300px; top: 164px; left: 442px; overflow: hidden;"> 

이 colorbox의 CSS 파일입니다 :

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9997; overflow:visible; box-shadow: 0px 0px 5px #000000;} 
/*#cboxOverlay{position:fixed; width:100%; height:100%;}*/ 
#cboxMiddleLeft, #cboxBottomLeft{clear:left;} 
#cboxContent{position:relative; overflow: visible;} 
#cboxLoadedContent{overflow:auto;} 
#cboxTitle{margin:0;} 
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;} 
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} 
.cboxPhoto{float:left; margin:auto; border:0; display:block;} 
.cboxIframe{width:100%; height:100%; display:block; border:0;} 

/* 
    User Style: 
    Change the following styles to modify the appearance of ColorBox. They are 
    ordered & tabbed in a way that represents the nesting of the generated HTML. 
*/ 
#cboxOverlay{background:#212121;} 
#colorbox{} 
    #cboxContent{margin-top:0px; overflow:visible;} 
     #cboxError{padding:50px; border:1px solid #fff;} 
     #cboxLoadedContent{background:#000; padding:0px; -moz-border-radius: 4px; border-radius: 4px;} 
     #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;} 
     #cboxLoadingOverlay{background:#000;} 
     #cboxTitle{position:absolute; top:-22px; left:0; color:#000;} 
     #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;} 
     #cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose{text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(images/controls.png) no-repeat 0 0;} 
     #cboxPrevious{background-position:0px 0px; right:44px;} 
     #cboxPrevious.hover{background-position:0px -25px;} 
     #cboxNext{background-position:-25px 0px; right:22px;} 
     #cboxNext.hover{background-position:-25px -25px;} 
     #cboxClose{background-position:-50px 0px; right:0;} 
     #cboxClose.hover{background-position:-50px -25px;} 
     .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;} 
     .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;} 
     .cboxSlideshow_on #cboxSlideshow.hover{background-position:-100px -25px;} 
     .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;} 
     .cboxSlideshow_off #cboxSlideshow.hover{background-position:-75px -25px;} 

이 감사는 :))))))

답변

2

볼에 숨겨진에서 JS, 그러나 이것은 내가 불을 지르고에서 무엇을 가지고 스타일 시트에 overflow:visible !important;을 사용해보세요. 이것은별로 좋지 않습니다. 그러나 원래 위치를 찾을 수 없다면 유용한 픽스가 될 수 있습니다.

+0

흠, 운이 없습니다. 나는 방화산에서 보이는 오버 플로우를 바꿨고 그 div는 아직 보이지 않고있다. 내 코드도 잘못 될 수 있습니다. – pufAmuf

+0

이제 작동합니다! 궁금한 모든 사람들을 위해 : jquery.colorbox.js에서 $ content = $ div ("Content")를 추가했습니다. 오버플로 : visible '), 그리고 div를 div의 한쪽에 추가했습니다.))) – pufAmuf

+0

사실, 왜 작동하는지 이유는 눈에 보이는 중요한 라인 이었기 때문에 :)) – pufAmuf

0

line30의 colorbox.css에서 #cboxClose를 제거하고 30 행 이후에 새로운 행을 삽입 한 후

을 삽입하십시오.
#cboxClose{position:absolute; top:-29px; right:0; background:url(../i/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;} 

닫기 (x) 버튼의 잘못된 위치로 인해 문제가 해결되었습니다.

관련 문제