iSlider—多是最流暢的移動端滑動組件

iSlider是一個專爲移動端設計的滑動組件,項目地址: https://github.com/BE-FE/iSlidergit

iSlider是我參與的第二個比較正式的開源項目,主要編寫了裏面的動畫部分,滾動圖效果在PC上早已經是個小兒科的問題,也有不少成熟的庫能夠用。剛據說這個項目的時候,我也以爲有點重複造輪子的感受,不事後來聽了做者的代碼分享,感受這個項目仍是很是有價值的,最終我也加入到了代碼貢獻者的行列中了:github

應用場景豐富,在PC下,輪播圖只是整個網站中的一個小組件,有時甚至無關緊要,可是移動端每每會在頁面的主要展現上採用滑動效果,尤爲是微信深刻你們的生活以後更是如此。
DOM元素最小化,通常的輪播圖都是有幾幅圖片,就會在頁面中添加幾個圖片,可能還要包括外層的連接、容器等元素,而目前iSlider不管須要多少圖片,在頁面中永遠不超過3個web

  • 容器,這在移動端是很是有意義的,不會出現越滾越卡的狀況了。
    小而美,壓縮後只有2kb,不依賴任何庫或是框架,只針對移動端設計,滑動效果高效流暢。
    功能強大,目前包括如下功能:
    1. 圖片和dom 兩種類型滑動,圖片的類型很適合讀圖類的app,dom類型則能夠根據須要配置成各式各樣的webapp
    2. 自定義的事件回調,你能夠在滑動中,滑動結束,或是滑動開始綁定本身的事件回調
    3. 可配置的滑動動畫,在得到高性能的同時,你仍然能夠指定一些特殊的高級的動畫效果來完成你的app,iSlider 提供3d,flip,depth等動畫方式來豐富你的滑動效果。
    4. iSlider 會幫你處理好屏幕旋轉事件,你只要考慮的是,屏幕旋轉後,你的dom 或是 圖片改如何顯示。
    5. iSlider 還有一些小功能,好比滑動邊界遞減,自動滑動,垂直水平滑動可配置.

    後續咱們計劃增長手勢縮放圖片、頁面內部tab切換等更強大的功能,但願有更多的人來使用,也歡迎你們提交issues和pull request~爭取打造最好用的移動端滑動組件。微信

  • 相關文章
    相關標籤/搜索