LightWindow 라이트박스의 업그레이드

Web/WEB기본

LightWindow 라이트박스의 업그레이드

saltdoll 2008. 6. 10. 08:46

LightWindow 라이트박스을 모태로 업그레이드 된 스크립트네요.
라이트박스 계열의 약점인 iframe에서 안되는 부분도 잘 보강된것 같네요.

라이트 윈도우
--> http://stickmanlabs.com/lightwindow/#why

[ HTML정의 내용 ]
주의: iframe안의 링크를 parent에 입히기 DOCTYPE를 XHTML로 주어야 합니다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

[ 자바스크립트 file ]

<script type="text/javascript" src="javascript/prototype.js"></script> 
<script type="text/javascript" src="javascript/scriptaculous.js?load=effects"></script> 
<script type="text/javascript" src="javascript/lightwindow.js"></script> 
<link rel="stylesheet" href="css/lightwindow.css" type="text/css" media="

screen" />

[ iframe Call ]

<a href="http://www.stickmanlabs.com" class="lightwindow_iframe_link" ><strong>Open a LightWindow from an iframe!</strong></a> 
<script type="text/javascript"> 
    var links = $$('.lightwindow_iframe_link'); 
    links.each(function(link) { 
        Event.observe(link, 'click', function() {parent.myLightWindow.activate(null, link);}, false); 
        link.onclick = function() {return false;}; 
    });         
</script>

라이트박스관련 내용
--> http://source.tistory.com/tag/lightbox