Farbtastic

Farbtastic是一個color picker插件。它能夠在一個頁面中加入多個顏色選擇控件，然后每個控件關聯到頁面中的一個元素比如：文本輸入框。


Farbtastic
jQuery Color Picker 21世紀開運網在線排盤星座就成功運用這些技巧，www.21kaiyun.com

一個簡單的顏色選擇控件。操作方式與Adobe Photoshop中顏色選擇操作置。




iColorPicker

iColorPicker是一個只有6KB大小的jQuery Color Picker。只要將輸入框的class屬性設置為“iColorPicker”就能變一個漂亮的顏色選擇器。


iColorPicker

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

ContextMenu

用于創建右鍵彈出菜單的jQuery插件。


ContextMenu

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

imgAreaSelect

imgAreaSelect這個jQuery插件能夠選取一張圖片中一個矩形區域。


imgAreaSelect

Easy Slide

EasySlide 是以jQuery為基礎開發的一個圖庫展示插件，EasySlide可以將任何一個網頁容器(Container)內的圖形自動將其排列展示，并加上鼠標指向時的暫停效果(Pause)，可以當作圖庫展示或是動畫及廣告Banner使用。


Easy Slide


Easy News

Easy News是一個可以讓您輕松顯示網站新聞或圖文內容展示的jQuery插件，可設定Fade In-Out ,Slide Up-Down, Left To Right 的效果，調整顯示速度，可自行修改CSS改變您為喜歡的風格。


Easy News


Easy News Plus

Easy News Plus是基于Easy News開發，滾動式新聞或圖文內容展示的jQuery插件，但是與Easy News有完全不同的顯示方式(以左右滑動為主要的顯示方法)。

Easy News Plus
jQZoom

基于jQuery開發的圖片放大鏡插件。


jQZoom

jQuery Plugin: Text Highlight

利用javascript對頁面中的關鍵字進行著色的jQuery插件。



jCarousel Lite

這個jQuery插件能夠幫助你以滾動（carousel）的方式來組織圖片和其它內容。


jCarousel Lite


jCarousel

jCarousel是一個jQuery插件用于控制一個列表項目的水平或垂直順序，列表項目的內容可以是靜態HTML內容或通過AJAX加載的內容。可以向前或向后滾動。


jCarousel

Spacegallery-Jquery

一個采用jQuery開發，類似于Flash效果的圖庫（image gallery）。



jQuery Slider Gallery

這是一個基于jQuery開發相冊控件，類似于Apple網站上用于展示產品的效果。




jQuery Cycle Plugin

jQuery Cycle Plugin是一個slideshow插件。支持多種變換效果：shuffle、zoom、fade、turnDown、curtainX、scrollRight。




Zoomimage

該jQuery插件能夠讓以當前流行的方式來展示圖片。提供：預加載圖片提示，對圖片進行分組，自動調整圖片顯示比例，圖片分組瀏覽控制。


Zoomimage


prettyPhoto

prettyPhoto是jQuery lightbox的一個“克隆”。并增加動畫效果，圖庫瀏覽等特性。


prettyPhoto


ThickBox

ThickBox是一個模式對話框UI控件。基于jQuery開發，可以用來展示單張或多張圖片，內嵌的內容，iframed的內容，或通過Ajax獲取的內容。


ThickBox

Galleria

Galleria 是一個采用jQuery開發的圖片展示插件。它通過縮略圖導航一張一張的顯示大的圖片。支持通過CSS設置整個相冊的風格。能夠按比例創建縮略圖并剪切成適合在縮略圖容器中顯示的小圖片。能夠觸一些事件，因此可以在圖片加載時執行一些動作。


Galleria

jQuery Flash Plugin

一個jQuery插件用于在頁面中嵌入Flash影片。




jQuery.SerialScroll

jQuery.SerialScroll是一個用于創建滾動效果的jQuery插件，支持水平／垂直方向滾動和混合滾動效果。




InnerFade

InnerFade這個jQuery插件能夠讓任意一組元素（img，div等）實現淡入淡出播放效果。


InnerFade

NyroModal

一個基于jQuery開發，非常靈活和可定制外觀/動畫效果的模式對話框。可通過Ajax調用目標內容，改變對話框大小等。


NyroModal

CrossSlide

CrossSlide這個jQuery插件實現了一些常用Javascript幻燈片放映動畫效果如：動態地移動、縮放、漸變、滑入"滑出等。


CrossSlide

Magnify

Magnify是一個能夠在圖片上添加放大鏡功能的jQuery插件。


Magnify


Img Notes

用于當鼠標移到圖片是時，顯示一個信息提示框。


Img Notes
FancyZoom

FancyZoom采用縮放效果來展示圖片或任意HTML頁面，不需要另外開啟頁面來載入圖片，其效果在Apple Mac的官方網站中也有。


FancyZoom

Jcrop

Jcrop 是一個跨瀏覽器的jQuery圖片剪切插件（jQuery image crop plugin）。支持對剪切框加CSS樣式，當選取或拖動時添加回調事件（Callbacks），剪切時能夠約束寬度與高度。


Jcrop
Galleriffic

Galleriffic是一個用于創建快速展示相冊中照片的jQuery插件。圖片既可以以幻燈片的方式查看，也可以手動點擊縮略圖查看。Galleriffic還支持分頁，從而使得它能夠展示更多的圖片。


Galleriffic
Image Upload and Auto Crop

采用PHP+jQuery開發的圖片上傳和剪切（Crop）工具。




prettyGallery

prettyGallery是一個圖庫導航控件Slider。基于jQuery開發，除了可以導航圖片之外，還支持其它任何內容。可以配置導航滾動速度和圖片標題說明。


prettyGallery
jQuery.popeye

jQuery.popeye 這個插件能夠將一組無序的圖片列表轉換成一個簡單的相冊。當點擊圖片時將以Lightbox風格放大圖片。圖片展示框提供向前/向后控制并能夠為每一張圖 片添加備注說明信息。jQuery.popeye能夠根據圖片大小自動調整展示框的高度和寬度。


jQuery.popeye
s3Slider

s3Slider 是一個jQuery slideshow插件，效果類似于smooth slideshow。

可以在圖片上的任意位置，透明顯示當前所放映圖片的說明信息。


s3Slider

Pirobox

采用jQuery開發的Lightbox控件。能夠根據瀏覽器窗體大小自動調整展示圖片大小。提供向前/向后控制鏈接。動態加載圖片效果。易于定制。


Pirobox

Simple Controls Gallery

這是一個采用jQuery開發的圖片slideshow控件。提供一個暫停/播放/向前/向后展示的控制菜單。這個jQuery slideshow可以設置當頁面打開時自動播放圖片并能夠將最近查看的圖片存儲在cookie中。




Agile Carousel

Jquery Slideshow插件。易于定制圖片切換效果。提供開/關圖片標題顯示，添加文本水印等功能。


Agile Carousel
jQuery Plugin-Page Peel

這是一個用于創建Page Peel(卷頁/頁面剝落)特效的jQuery插件。





Easy Slider

一個jQuery插件，當點擊導航按紐時可以水平或垂直播放圖片或其它任何內容。


Easy Slider
imgPreview

圖片預覽jQuery插件。當鼠標移到圖片鏈接上時，會在鏈接的旁邊出現一個類似于tooltip效果的圖片展示框。


imgPreview
Jquery Fade In.Fade Out

這是一個用于讓圖片產生淡入淡出效果的jQuery插件。





Captify

這個jQuery插件能夠在圖片上顯示標題信息，當鼠標放到圖片上時滑動出現。


Captify
jParallax

這是一個用于生成視差現象的jQuery插件。mParallax能夠產生的效果與jParallax一樣但采用Mootools框架開發。



jParallax

jQuery---運用圖片預加載技術打造幻燈片

截圖：





一些演示：

http://www.21kakiyun.com
http://www.cssrain.cn/demo/jQueryImgLoad/Demo1/demo2.html

http://www.cssrain.cn/demo/jQueryImgLoad/Demo2/demo3.html
http://www.cssrain.cn/demo/jQueryImgLoad/Demo3/demo4.html

http://www.cssrain.cn/demo/jQueryImgLoad/Demo1/demo1.html (以前做的，非預加載)

下載：
http://www.cssrain.cn/demo/jQueryImgLoad/jQueryImgLoad.rar

jQuery pageSlide 是一個jQuery插件，它可以控制一個隱藏頁面的顯示和關閉。具體來說，就是當前頁占一個完整頁面，隱藏頁是看不到的，你設置一個控制的地方，點擊該控制時觸發事件，隱藏的頁面就彈出來。再次點擊隱藏頁面以外的空間，它就又關閉。

這適合在有限的空間里，在主頁里放重要內容，而隱藏頁放一些并不一定要顯示，而是有需要的用戶才去展開顯示的內容。

Creating a Slick Auto-Playing Featured Content Slider

Niall Doherty的 Coda Slider 為許許多多的設計師帶來了靈感. Chris Coyier 創建的這個Slick Auto-Playing Featured Content Slider 使用 Coda Slider插件 ，實現我們常說的”圖片焦點特效”。多用于門戶站。

非常漂亮的一個特效布局。由 Benjamin Sterling 創建的這個 portfolio layout 使用了jQuery的 easing plugin. 適合那些想用來展示個人作品集的用戶。

它在頁面兩邊顯示帶縮略的作品列表，當你點擊每個條目時，會在中間部分以退場然后進場的特效呈現出該作品的全部內容。

jQuery---圖片先模糊后清楚
http://www.hotbook.cn/

很多圖片網站用了這種技術，Google圖片中心也不例外。
這種技術的圖片是先顯示模糊的，然后再顯示清楚的。

這個模糊的原理就是 一張小圖片，然后把尺寸放大，大小等于大圖片的寬度和高度。
小圖片被拉大了，理所當然就模糊了。

試想：小圖片的尺寸是10kb,大圖片的大小是500kb，那么加載小圖片的速度就是大圖片的50倍。
當然你會說，如果直接顯示大圖片是什么情況呢？答案是：一片空白等著你。

?使用jQuery實現網頁報紙

原理：使用報紙內容作為 背景圖，相對定位。
然后里面的div設置為絕對定位，大小，left和top都要跟背景圖匹配。
所以這個有一定的規律。

引申：
當后臺人員問，每次要傳坐標，寬度和高度不麻煩么？用戶知道使用么？
教用戶使用photoshop？。。。！！！
解決方案：
使用圖片截圖的插件即可，一般的截圖插件都能獲取4個坐標，寬度和高度，
當然我們只需要這些，并不需要把圖片真正截取下來。

jQuery購物網站產品展示.

程序介紹：
1，點擊大圖可以彈出遮罩效果.
2，下方小圖可以左右滾動.
3，點擊新窗口打開，可以打開當前的大圖片.
4，遮罩層中小圖也可以左右滾動，也可以打開大圖片.

在 IE6,IE7,Firefox3 & google 瀏覽器下測試通過.


演示：
http://www.cssrain.cn/demo/jqueryProduct/demos.html

下載：
http://www.cssrain.cn/demo/jqueryProduct/jqueryProduct.rar Gallerific

Galleriffic 是使用 Mike Alsup 的 創建的圖片展示效果，包括縮略圖、圖片標題和描述等詳細功能，是一個非常不錯的高質量畫廊相冊展示工具。

2，ZoomImage

zoomimage ，以一種獨具魅力的方式展示圖片效果。縮略圖鏈接在本頁彈出大圖，并且可以可以隨意拖拽該懸浮圖片。

3，EasySlider

Easy Slider 可以實現圖片或其他任意內容，在水平或垂直方向上的滑動效果，你還可以通過 CSS 自定義設置樣式。

4，The Slider from Barack Obama’s website

一個源自美國總統 Barack Obama 網站的垂下滑動菜單控制的圖片幻燈效果。

5，CodaSlider

CodaSlider，又一個不錯的滑動控制效果。

6，jQuery Slider II

jQuery Slider II 的布局非常符合操作習慣，在底部列出帶滾動條的縮略圖控制列表，然后在上面顯示對應圖片的大圖瀏覽，非常適合做高級相冊。

Beautiful Slider， 光看這個效果圖你就知道這個插件有多棒了吧，是的，這個插件實現的效果已經不遜色于Flash完成的效果，整體表現流暢，文字顯示效果更是創意獨特。

８，LoopedSlider

loopedSlider是又一個任意內容滾動切換的幻燈片插件，使用操作簡單。

9，SpaceGallery

SpaceGallery是一個全新的jQuery插件，點擊當前圖片，會自動放大消失，同時后面的圖片向前展示，有一種時光機器的感覺。

10，jQuery Popeye

SmoothGallery是一個最好的 Javascript 幻燈片效果之一，可以實現各種不同的幻燈片轉換效果。

14，jQuery Multimedia Portfolio

是一個基于jQuery 的滑動效果插件,除了可以展示圖片之外，還可以加入各種不同類型的多媒體文件。

s3Slider是一個非常簡單實用的流暢幻燈片效果，這個插件被應用在無數的WordPress專業主題模板中。

?

總結

以上是生活随笔為你收集整理的超强的jquery极品插件--色彩选择器类/ 右键菜单类/ 图片新闻flash展示类的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。