用JS做一個滑動窗口的特效

1. 效果展示

2. 代碼編寫

2.1 分析

• 首先，外面有一個大的div，也就是爲藍色背景的那個div。裏面還有一個更大的div，必須超出藍色背景的父div，否則js中的scrollLeft是不能用的，將一直爲0。
• 比較大的第二層div又包含着兩個小的div,這兩個div一樣，只是id值不同。包含着四張圖片。而且最外邊的div寬度要正正好好放下這四張圖片。否則滑動會有空隙。
• 第二層的div要浮動，它裏面的兩個div也要浮動，裏面的圖片都要浮動。所以父盒子又必要重新計算高度。
  

2.2 js代碼

• 如果第一個圖片框還沒有完全滑動走，那麼就讓它一直向左滑動。如果它已經完全滑動完畢，隱藏了，就把它拽回來繼續，重新滑動。