2012-10-15 4 views
5

'rev'인라인 태그를 사용하는 shadowbox 캡션 솔루션을 구현했습니다. 페이지의 마크 업에서 파일의 맨 아래에 다음을 추가shadowbox.js rev 캡션을 사용자 정의하는 방법은 무엇입니까?

shadowbox.css에서
...get("sb-caption").innerHTML=obj.link.rev||"";... 
...<div id="sb-caption"></div>... 

shadowbox.js 담기

...

#sb-info,#sb-info-inner{height:56px;line-height:20px;} 
#sb-caption {clear:both;font-size:90%;height:auto;line-height:12px;color:#fff;} 

는 회전 속성을 추가 (예, 그것은 확인해과 같은 유효한 속성입니다!) 링크에 ... 캡션 텍스트가 회전 속성에 간다 ... 난

<a href="myimage.jpg" rel="shadowbox" title="My Image" rev="Your caption goes here...">My Image</a> 

의 그 t ... 즐기십시오!

더 여기 설명 : http://shadowbox.1309102.n2.nabble.com/Captions-td2643307.html

이 구현하는 아주 쉬운 일이었다.

그러나, 나는 내 자신의 CSS ...

#sb-caption{text-align:right;line-height:22px;color:#333;position:absolute;bottom:35px;right:35px;background:rgba(255,255,255,0.3);text-shadow: 1px 1px 1px #fff;display:block; padding:10px 20px 10px 50px;z-index:10;} 

이 모든

뿐만 아니라 놀라 울 일을 생성하지만, 내가 문제를 발견했다. 이미지가 회전이없는

의 # sb의 캡션 사업부는 반투명 흰색 블록으로, 어쨌든 표시, 크기 (패딩과 같은) 에서 20x70 픽셀 본인은 내 패딩 세트 - 문제가 발생했습니다.

누구나 해결 방법을 찾을 수 있는지 궁금합니다. rev = ""가 지정되지 않은 경우 shadowbox에 # sb-caption을 표시하지 않도록 지시합니다.

누구든지이 문제를 해결할 수 있습니까?

어쩌면이 라인을 따라 뭔가 ??

<script type="text/javascript"> 
    Shadowbox.init({ 
    }); 
    var Shadowbox = window.parent.Shadowbox; 
    if (getElementById('sb-caption').innerHTML == '') 
    getElementById('sb-caption').style.display = 'none'; 
</script> 

...하지만 작동하지 않습니다.

답변

1

당신이 가까이 있었지만, shadowbox.js에서 직접 처리 할 수 ​​있습니다 (어쨌든 변경하는 경우). 작업이 완료이

ad("sb-caption").style.display = (ad("sb-caption").innerHTML == "") ? 'none' : 'block' ; 

바로

ad("sb-caption").innerHTML=aJ.link.rev||""; 

후 삽입합니다. 나는 그것이 무엇을하는지 분명히 생각합니다. Shadowbox를 열 때마다 id = "sb-caption"요소 내의 내용을 확인합니다. 내용 집합이 없으면 표시를 none으로 설정하고 그렇지 않으면 차단합니다.

관련 문제