2014-12-03 53 views
0

我正在尋找jQuery的效果,打開div的窗口像翅膀。所以每個機翼都會站在一邊。jQuery - 打開窗戶的翅膀效果

例子:

example

我試圖從網上搜索,但沒有運氣。也許有人知道這種效果的名稱,或者更好的鏈接或技術來實現這種效果。

謝謝你的鏈接/代碼/建議。

+0

你特林一個動畫?如果沒有,嘗試創建一個點擊jQuery改變圖像的scr – zwitterion 2014-12-03 07:29:46

+0

猜你可以幫助你..http://thefinishedbox.com/files/tutorials/slidingdoors/index.html – Sarath 2014-12-03 07:36:59

+0

你應該有三個單獨的圖像,然後動畫在css3中使用'keyframes' – 2014-12-03 07:50:01

回答

0

如果你特林動畫給你一個解決方案

<div class="img"> 
    <img id="imgTest" src="http://thezonemag.files.wordpress.com/2011/07/open-window.jpg" alt="Klematis" width="110" height="90"> 
</div> 


$(document).on("click", "#imgTest", function(e){ 
     e.preventDefault(); 
     $(this).attr("src","http://i639.photobucket.com/albums/uu112/mich36/Tropical-Breeze.jpg"); 

    }); 

http://jsfiddle.net/87bmncex/

+0

一旦它被改變,你就不需要再次設置attr了... – Riad 2014-12-03 07:58:22

+0

你可以創建一個「open」類。然後在你的代碼裏面(!$(this).hasClass(「open」)){寫你的代碼打開} – zwitterion 2014-12-03 08:08:50

+0

http://jsfiddle.net/87bmncex/1/ – zwitterion 2014-12-03 08:12:43