2012-01-08 1 views
4

라이트 박스에 대한 질문이 있으시면 my jsFiddle을 참조하십시오. 이미지 중 하나를 클릭하면 그림의 더 큰 버전이 페이지 오버레이로 열립니다.esc 키를 사용하여 라이트 박스 페이지 오버레이를 닫는 방법

ESC 키를 사용하여이 페이지 오버레이를 닫는 방법?

그리고 화살표 키를 사용하여 다음 이미지로 이동하는 방법은 무엇입니까?

어떤 종류의 jQuery 플러그인/javascript가 필요합니까?

<ul class="lb-album"> 

        <li> 
         <a href="#Fly-My-Pretties-Walled-Garden"> 
          <img src="http://sandipa.com.au/images/works-for-sale/thumbs/Fly-my-Pretties-Walled-Garden-sm.jpg" alt="Fly My Pretties: Walled Garden"> 
          <span>Fly My Pretties</span>      </a> 
      <div class="lb-overlay" id="Fly-My-Pretties-Walled-Garden"> 
          <a href="#page" class="lb-close">x Close</a> 
          <img src="http://sandipa.com.au/images/2010-2011/1000px-wide/Fly-my-Pretties-Walled-Garden.jpg" alt="Fly My Pretties: Walled Garden"> 
          <div> 
           <h3>Fly My Pretties: Walled Garden<span>mixed media on canvas</span></h3> 
           <p>72 x 137 cm</p> 
           <a href="#Light-that-Shapes-the-Shadows" class="lb-prev">Prev</a> 
           <a href="#Central-Highlands-Circle-of-Gold" class="lb-next">Next</a>        
          </div> 
         </div> 
        </li> 

<li> 
         <a href="#Central-Highlands-Circle-of-Gold"> 
          <img src="http://sandipa.com.au/images/works-for-sale/thumbs/Central-Highlands-Circle-of-Gold-sm.jpg" alt="Central Highlands: Circle of Gold"> 
          <span>Circle of Gold</span>      </a> 
      <div class="lb-overlay" id="Central-Highlands-Circle-of-Gold"> 
          <a href="#page" class="lb-close">x Close</a> 
          <img src="http://sandipa.com.au/images/works-for-sale/Central-Highlands-Circle-of-Gold.jpg" alt="Central Highlands: Circle of Gold"> 
          <div> 
           <h3>Central Highlands: Circle of Gold<span>mixed media on canvas</span></h3> 
           <p>51 x 108 cm</p> 
           <a href="#Fly-My-Pretties-Walled-Garden" class="lb-prev">Prev</a> 
           <a href="#Guardian-of-the-Night" class="lb-next">Next</a>       
          </div> 
         </div> 
        </li> 

</ul> 

답변

3
+0

감사를 가지고,하지만 내 라이트 박스 (http://www.sandipa.com.au/works-for-sale.html) I로까지 jQuery를 사용하지 않습니다하세요 말할 수있다. 그것은 html5와 css3을 사용합니다. Esc와 화살표 키 기능을 추가하기 위해 할 수있는 html/css에 뭔가가 있어야합니다. (나는 희망했다. ..) –

관련 문제