實現水平移動和縮放UI效果 - 可能的jQuery插件（？）

-3

我的靈感是http://www.diesel.com/bags-female。任何人都可以解釋我可以如何實現這種效果？實現水平移動和縮放UI效果 - 可能的jQuery插件（？）

我已經開始使用此代碼：

$(document).ready(function(){ 
    $('#background-thing').mousemove(function(e){ 
     var mousePos = (e.pageX/$(window).width())*100; 
     $('#background-thing').css('backgroundPosition', mousePos+'% 0'); 
     //alert(mousePos); 
    }); 
    });

但它只是平移背景圖像。我希望在背景圖像上有多個鏈接，這些鏈接是錨點，單擊這些圖像將對該特定座標產生縮放效果。

我應該看看一個jQuery插件嗎？如果是這樣，你的建議是什麼？

來源

2013-11-20 subho das

您可以檢查此 - http://lodep.com/best-free-parallax-scrolling-jquery/和http://www.jqueryscript.net/tags.php ？/視差/如果你覺得它們有用。 –

我不認爲你想要或需要任何jquery插件爲你在做什麼。

您提供參考的頁面使用css 3d轉換和默認的jquery。這裏有W3Schools的爲參考：http://www.w3schools.com/css/css3_3dtransforms.asp

具體是這樣的：

//clearly broken code used just for example 
$(document).ready(function(){ 
    $('#yourpagecontainer').on("click","a",function(){ 
     $(this).css("transform", "scale3d("+x+","+y+","+z+")"); 
    } 
}

您提供的不說清楚你要遠遠到底是什麼代碼，但也許你會獲益從這個例子看：http://sarasoueidan.com/blog/windows8-animations/

它不完全相同，但它是在你想做的事情。

來源

2013-12-01 20:37:55