jQuery套件―3款「Before/After使用前後」特效大合集

梅問題-3款Before/After使用前後特效立即下載與套用
  一直不斷有朋友問到,在梅問題教學網中的,使用前與使用後的特效是怎麼作的,其實這個特效是梅干很早之前,請好友男丁大大幫忙寫的,而這特效現在網路上已有不少現成的套件可使用,且用方法也相當的簡單,只要將Javascript載入到網頁中,再依照套件所需的HTML結構,立即就會有此效果,而梅干也整理了一下目前網路上,3款還不錯的使用前後的套件與大家分享,且下載完畢解壓後,立即套用即可,因此有需要的朋友,也一塊來看看吧!!

TwentyTwenty:
這款梅干還推薦的,無論是套用還是標籤結構都很單純。
梅問題-3款Before/After使用前後特效立即下載與套用
[範例預覽] [範例下載]
BEFORE AND AFTER SLIDER WITH JQUERY:
這個與剛不同的是,中間的控制鈕有三種模式,但這個標籤結構比上一個來的複雜一些。
梅問題-3款Before/After使用前後特效立即下載與套用
[範例預覽]
Drag a Slider Over Before/After the images with jQuery Plugin:
這一個下方多了前後的連結,當點了連結後,畫面會快速的切換,無需再拖拉。
梅問題-3款Before/After使用前後特效立即下載與套用
[範例預覽] [範例下載]
  這三款使用前後的特效,使用都相當的簡單,同時結構也很單純,並且在預覽的頁面中,都有詳細的說明資訊,只要依照網頁中的步驟作,立即就可讓網站有使用前後的效果,相當的簡單喔!因此有需要的朋友,也趕快來下載囉!

相關文章

「Retina.js」網頁圖片支援Retina螢幕,並自動切換高解影像

「Retina.js」網頁圖片支援Retina螢幕,並自動切換高解影像

jQuery取得各裝置視窗實際顯示的寬度、高度

jQuery取得各裝置視窗實際顯示的寬度、高度

「Lazy Load CSS」非同步載入CSS,當網頁使用雲端字型更順暢

「Lazy Load CSS」非同步載入CSS,當網頁使用雲端字型更順暢

jQeury外掛「scroll-scope」鎖定DIV區塊滾動範圍

jQeury外掛「scroll-scope」鎖定DIV區塊滾動範圍

jQuery教學-RWD自適應導覽列多層級下拉選單

jQuery教學-RWD自適應導覽列多層級下拉選單





回應本篇 »

(姓名)*必填
(信箱)*必填
(網站)

※PS: 因梅干時間有限,教學網中所分享的主題繁多(所遇狀況也很多),可能無法一一回答各位,不便之處還請見諒。
※PS: 本教學網不提供「破解檔」、「註冊機」或「註冊碼」等資訊,請勿利用留言索取檔案。

共 1 梅留言

  • 第1梅
    Betty 說道:

    梅老師您好:
    感謝分享這篇特效,受益良多。
    但請問老師,您下面這篇的特效如何做?
    《Photoshop CC 2015限定》除霧新功能,照片起大霧也不怕
    https://www.minwt.com/ps/13211.html
    因為您這款的滑鼠移入就自動滑動,不需拖曳,視覺上較優。
    煩請老師指導,謝謝。

    回應:
    由於梅問題所使用的使用前後 是由男丁老師所協助開發的,
    所以功能上有點點不同