大家是不是會看到一些CSS店鋪有一個特別好玩的排行榜呢？當鼠標移動到任意一個名次標題時，對應的寶貝就會彈出，而沒被點到的寶貝就不顯示，沒錯，這就是CSS店鋪才擁有的獨特排行榜，那么，這么好玩的東西，我們普通店鋪能夠擁有嗎？小毅的回答是：當然！今天我就讓大家實現(xiàn)手風琴式排行榜！
------功能與效果-------
1：個性觸控
2：展示寶貝由你定，所有數(shù)據(jù)由自己定，更換方便
3：不受版面約束，就連寶貝詳情界面都能運用
4：效果視圖（當然滾動速度沒有這么快啦，呵呵，是5秒一次）
------使用方法-------
為了照顧新手淘友，我已經(jīng)把代碼寫的很完整了，是不用您修改代碼的，當然，您如果有興趣自己研究，那最好，呵呵，所以接下來新手淘友只用安裝和修改一些信息就OK咯，不要急，一個字一個字的看，絕對能看懂的
代碼的安裝
第一步：進入您店鋪的裝修頁面，在您的190模塊底部，您會看到一個“在此處添加新模塊”的區(qū)域，點擊它，建會彈出模塊對話框，選擇添加“自定義內(nèi)容區(qū)”，之后在您的190模塊處，就會多出一個新的“自定義內(nèi)容區(qū)”了哦~呵呵，看不懂？來看看示意圖吧：
第二步：模塊已經(jīng)添加了，現(xiàn)在我們雙擊剛剛添加的自定義內(nèi)容區(qū)，就會彈出編輯界面，我們可以看到上面有一排按鈕，這時我們點擊最右邊的那一個按鈕，我們就進入了代碼編輯模式了，來看看步驟圖：
第三步：下載附件區(qū)的代碼壓縮包，下載成功后，雙擊打開，里面會是一個名為“代碼”的txt文本，直接雙擊打開吧~之后全選（快捷鍵：Ctrl+A）文本里的全部內(nèi)容，全部復制（快捷鍵：Ctrl+A），回到自定義內(nèi)容區(qū)，在編輯區(qū)里進行粘貼，這時代碼就全部進入了自定義內(nèi)容區(qū)的代碼編輯模式了，接下來您就可以再次點擊最右邊的那一個按鈕，就可以看到實際的效果了~
看看步驟圖：
寶貝的更換
1----文字的更換：只用將您要更換的文字選中，再輸入您要的文字就行（選中就是將鼠標左鍵按著不動，移動鼠標，框選文字就行，框選之后，直接輸入文字）
框選效果：
2----圖片的更換：淘寶的系統(tǒng)優(yōu)化，為我們的裝修帶來了便捷，現(xiàn)在我們只用雙擊圖片就能直接編輯圖片的地址和鏈接了；那么，現(xiàn)在我們已經(jīng)能在自定義內(nèi)容
區(qū)看到圖片了，可是圖片鏈接并不是您要的，現(xiàn)在您要做的很簡單，那排名第一的寶貝舉例，雙擊寶貝圖片，您將會看見圖片的屬性框，里面
有圖片的地址和鏈接地址，你只需要把你要放上去的寶貝的寶貝圖片和寶貝地址對應替換進相應的窗口就行了，之后點擊確定
如圖所示：
3----替換完您要修改的全部信息后，您就可以點擊自定義內(nèi)容區(qū)的保存按鈕了，OK，點擊發(fā)布吧，手風琴式排行榜，我們就使用成功了
------附件區(qū)------
代碼下載地址：http://u.115.com/file/f2d7d23279
下載方法
1----點擊進入上面連接
2----
可以選擇電信或備份下載，方式：
1----右鍵-----目標另存為
2----右鍵-----使用迅雷下載
---------------------------------------------------------------------------------
講到這里，今天的課也就結束了，趕快利用這個有趣的排行榜進行您獨特的寶貝展示吧！嘻嘻，以后還有更加好玩實用的東西教給大家喲~呵呵
樂發(fā)網(wǎng)超市批發(fā)網(wǎng)提供超市貨源信息,超市采購進貨渠道。超市進貨網(wǎng)提供成都食品批發(fā),日用百貨批發(fā)信息、微信淘寶網(wǎng)店超市采購信息和超市加盟信息.打造國內(nèi)超市采購商與批發(fā)市場供應廠商搭建網(wǎng)上批發(fā)市場平臺,是全國批發(fā)市場行業(yè)中電子商務權威性網(wǎng)站。
本文內(nèi)容整合網(wǎng)站：百度百科、知乎、淘寶平臺規(guī)則
