2012-09-22 2 views
0

fancybox iframe에 대해 두 개의 제목 상자를 설정하려고합니다. 버전 1.3.4를 사용 중입니다. 현재이 광고가 표시됩니다.팬시 박스에 2 개의 제목이 있습니까?

enter image description here

그리고 이것은 관련 소스 코드 :

$(document).ready(function() { 
     $("a.group").fancybox({ 
      'zoomSpeedIn'   : 600, 
      'zoomSpeedOut'   : 500, 
      'easingIn'    : 'easeOutBack', 
      'easingOut'    : 'easeInBack' 

     }); 

$("a.iframe").fancybox({ 
     'titlePosition' : 'over', 
      'showCloseButton' : false, 
      'titleShow'   : true, 
      'scrolling'   :'no', 
      'width'  : 650, 
      'height'  : 660, 
      'autoScale'   : false, 
      'transitionIn'  : 'none', 
      'transitionOut'  : 'none', 
      'type'    : 'iframe', 
      'hideOnOverlayClick': false, 
      'hideOnContentClick': false, 
      'enableEscapeButton': false 
     }); 
    }); 

하지만 난의 상단에있는 하나를 삭제하지 않고 내 라이트 박스의 하단에 동일한 제목 상자를 가지고 싶습니다 그것. 그래서 fancybox CSS에 다른 속성을 만들었습니다.

.fancybox-title-over1 { 
    position: absolute; 
    bottom: 0; 
    left: 0; 
    color: #FFF; 
    text-align: left; 
} 


#fancybox-title-over1 { 
    padding: 10px; 
    background-image: url('mybottomtitlebackground.png'); 
    display: block; 
} 

그러나 라이트 박스에 표시하는 방법을 모르겠습니다.

도움을 주셔서 감사합니다.

+0

은 현재의 약자로 ? jquery를 사용하여 요소를 복제하고 올바르게 배치 할 수는 있지만 피들 (fiddle)을 제공하면 쉽게 알 수 있습니다. –

+0

대답 해 주셔서 감사합니다. 여기는 jsfiddle입니다 : [link] (http://jsfiddle.net/a65ZN/) – user1690815

답변

0

내가 제대로 질문을 이해한다면, 당신은 그 제목을 복제 바닥에 그것을 배치 할 수 있습니다 :

var title = $(".fancybox-title-over"); 
title.css({'top':'0px', 'bottom':'auto'}); 
var p = $(".fancybox-title-over").parent(); 
var x = $(".fancybox-title-over").clone(); 
p.append(x); 
x.css({"top":"auto","bottom":"0", "position":"absolute"}); 
이 이

업데이트 바이올린이 : http://jsfiddle.net/a65ZN/11/ 당신이 fancybox를 보여주는 바이올린을 제공 할 수

+0

그게 내가 필요한 것입니다. 도와 줘서 고마워요! – user1690815

관련 문제