anita 提供的 jQuery 版的廣告輪播

我套了一個 jQuery 版本的廣告輪播, 在 google 下 keyword: jQuery slider 就可以查到很多漂亮的 silder, 像是:

• Agile-Carousel
• Beautiful jQuery slider-example
• blaze-slide-show-for-wordpress
• easyslider1.7
• JQAdCarousel
• jqGalScroll.2.1
• jQueryBlinds
• jquery-plugins.jquery.com
• simple-jquery-slideshow
• slideJS
• viljamis-ResponsiveSlides.js

最後我用的是超有才華的同事 Anita 提供的版本, 套完的畫面如下:

說明: 上面是套出來的半成品, 實際最後還要等 UI 設計師調整風格來符合目前的網站.


之前用 flash 套出來的畫面如下:

經過 UI 大師 annie 的巧手之後, 就變這樣子啦,超厲害的:

說明: 

• 通常 UI 設計師 提供的 javascript 範例通常有點亂, 還會有不相關的javascript code 在裡面, 需要 trace 一下才能拿到精簡後的 javascript code.
• jQuery 版本和 flash 版本的差異在, jQuery 的 UI 要調整比較方便, 而且彈性高, 要增加功能, 也比較方便(例如: 增加是否另外新視窗, 還是原視窗開啟超連結), 而且不支援Flash 的平台(例如: Apple 或低階的Andriod 平台) 上也可以看的UI.