作品:jQuery實作slidingWindow

今天心血來潮，想要寫一個網頁版的slidingWindow效果
也就是一次只能顯示特定單位的Block

設計方法是使用遮罩(Mask)的方式，主要顯示區塊的部分是黑色的Mask，然後有一條輸送帶(Slider)，載者輸送單位(Item Block)

如圖


基本架構大概是長成下面這樣

<div class=”Mask”>
<div class=”silder”>
<div class=”itemblock”></div>
<div class=”itemblock”></div>
<div class=”itemblock”></div>
</div>
</div>


有這架構之後，之後的動作跟設定就是jQuery的工作了
下面是成果，共有三個Block，可以向左向右移動