【IT168 專稿】新年伊始,相信廣大的程式設計師們也都有了自己的新年計劃。在新的一年裡,你為自己定下了怎樣的目標呢?本文選取了在2011年最給力的18個jQuery的教程分享給大家,希望大家在新年開始能學習到不少實用的jQuery技術知識。
1、利用視覺差效果的幻燈圖片播放器
在這篇教程中(http://tympanus.net/codrops/2011/01/03/parallax-slider/),將介紹如何利用人的視覺差的原理,設計一個向左滑動的幻燈圖片播放器,其中當用戶在瀏覽圖片時,會感覺到圖片和背景都在向左快速滑動,效果很眩。
2、表單切換的動畫效果
在這篇教程中(http://tympanus.net/codrops/2011/01/06/animated-form-switching/),你將會學習到如何在用戶填寫表單時(一般來說都會有若干步)切換幾種不同的表單的效果,這可以讓用戶在表單切換時,感覺到依舊是在同一個頁面中的變換效果。實現其實很簡單,都是在一個頁面容器中進行了動畫的變換,只不過是在表單的尺寸大小都變換了。
3、一個jQuery實現的帶有預覽縮略圖的圖片庫效果
在這篇教程中(http://tympanus.net/codrops/2011/01/19/sweet-thumbnails-gallery/),你將會學習到如何用jQuery實現一個向左滑動的圖片瀏覽功能,但這個跟普通的圖片瀏覽功能有點不同的時,當用戶點上圖的下面那些小圓點的時候,能夠預覽到還沒查看的圖片的小的預覽圖,這樣將會方便用戶決定是否繼續去查看,如果願意查看的話,則點擊縮略圖就可以打開完整的圖片了。
4、一個特別的引號顯示效果
在這篇教程中(http://www.marcofolio.net/webdesign/jquery_quickie_smooth_animated_quote_display.html),你將會學習到,如何把一段文字放在一個如上圖顯示的特別的雙引號之內。
5、閱讀jQuery代碼後的收穫
Paul Irish這位工程師,致力與jQuery和Google Chrome的研究,做了一個視頻講解,(http://net.tutsplus.com/articles/lectures/11-more-things-i-learned-from-the-jquery-source/),在其中講解了他從jQuery代碼中的閱讀所得。
6、用jQuery實現一個HTML5的幻燈自動播放效果
在HTML5中,播放圖片時可以設置自動播放的屬性,而在本篇教程中(http://tutorialzine.com/2011/01/how-to-make-auto-advancing-slideshows/),講解了如何使用jQuery去實現這個效果。