jquery，漂浮元素消失後的平滑過渡幻燈片

Question

我對jquery還是有點新鮮的，你可能會注意到。

Check out my jsfiddle

這裏是jQuery代碼，但我認爲你需要看到的例子爲這是明確的：

$(document).ready(function(){ 

       $('body').click(function(event) { 
        if($(event.target).is('.pageOne')) { 
         $('.pageTwo, .pageThree, .pageFour').fadeOut(); 
                } 

        else if ($(event.target).is('.pageTwo')) { 
         $('.pageOne, .pageThree, .pageFour').fadeOut(); 
         } 

        else if ($(event.target).is('.pageThree')) { 
         $('.pageFour, .pageTwo, .pageOne').fadeOut(); } 

        else if ($(event.target).is('.pageFour')) { 
         $('.pageThree, .pageTwo, .pageOne').fadeOut(); } 
       }); 



      }); // end ready 

這只是一個原型，我可能會在以後轉化爲東西有用。 基本上我想要做的是，當你點擊一個彩色文章，其餘的消失（它的作品），但你會注意到被點擊的項目有點跳轉到左邊，因爲它漂浮在左邊。

我想要的是讓點擊的文章以某種方式順利地向左滑動。

有關如何實現此目的的任何想法？

提前致謝！

Answer 1

也許你可以用animate()方法是這樣替換​​：

$('.pageTwo, .pageThree, .pageFour').animate({'width':'0','opacity':'0'}); 

檢查演示http://jsfiddle.net/QLcCT/6/