­
11月 2012 - A-Fu Design

dPassword 類似於手機輸入密碼時的效果基於 jQuery

上午11:41 / BY Fu
dPassword  密碼逐步隱藏 jQuery 框架套件 有時候在網頁輸入密碼時,會忽然不知道自己剛剛打到的是什麼字,接下來該打什麼字才是正確的密碼,這個時候大部分的人都只能夠把它全部都刪除之後再重新的輸入一次,這樣才能確保輸入的是正確的密碼文字。dPassword 這是一個基於 jQuery 框架咖開發的套件,在輸入密碼時會跟手機打密碼一樣,顯示最後一個輸入的文字其他隱藏住,如果忽然有人跟你說話你也還可以確認你剛剛輸入了什麼樣的文字了。 ...

Continue Reading

jQuery blockUI 網頁讀取中讓使用者不要進行別的動作

上午10:52 / BY Fu
jQuery blockUI 等待中套件基本樣式 jQuery blockUI 這一個 jQuery 套件能在網頁上增加一個遮罩的圖層,阻擋使用者在操作別的步驟。當設計很多需要用到 JavaScript 或者是 AJAX 的動作時,通常需要一些執行的時間,但是如果使用者在這一個時間又操作了不同的動作,有可能會造成程式執行不正常或中斷,所以有了這樣一個兼具提示訊息又能夠防止使用者操作的 jQuery 套件。 ...

Continue Reading

QuickFlip2 讓任何的 HTML 元素產生翻轉效果

上午10:25 / BY Fu
QuickFlip2 網頁元素翻頁效果 QuickFlip2 是一個可以讓任何的 HTML 元素標籤產生類似卡片翻轉效果的一個 jQuery 框架套件,看起來的效果就像是在 Apple iPhone 上的 UI 動畫一樣。可讓一些不太重要的資訊顯示於背面,當使用者有需要的時候才去點擊翻到背面去查看內容,也同時省下了很多的網頁空間可以拿來放置更多對網站有用的資訊。 ...

Continue Reading

jFontsize 可放大縮小網頁上任一區塊的文字大小

上午9:42 / BY Fu
jFontsize 網頁文字大小控制器 jFontsize 是一個輕量級的容易使用的一個基於 jQuery 框架的套件,用於在頁面上建立 A+ 、 A- 這樣的按鈕以便於改變文字的大小。支援自定義的按鈕樣式可透過參數設定字體最大可改變次數,以及每次變化的間隔大小等等。以方便不同的使用者瀏覽網頁。在網頁中增加這樣的一項功能,就能夠有效的提高用戶體驗。 ...

Continue Reading

jQuery TWzipcode 台灣縣市區和郵遞區號下拉選單

上午10:47 / BY Fu
jQuery TWzipcode 縣市區域選單 在製作網頁時偶爾會需要使用者的資料,為了讓使用者更有意願的填入資料所以開發者需要簡化輸入的步驟,讓使用者輸入的時候不會感覺到要輸入很多東西覺得很麻煩就離開了。jQuery TWzipcode 這一個 jQuery 套件還提供了多個預設選項可提供開發者使用,而且對某一些的瀏覽器使用者還可以偵測使用者的位置來直接幫使用者填入選項。 ...

Continue Reading

3D 書本翻頁的效果使用 HTML5,CSS3 和 jQuery 框架

上午9:31 / BY Fu
3D CSS3 Book Generator 網頁圖片翻頁 3D 特效 3D CSS3 Book Generator 使用 HTML5 以及 CSS3 的設計加上 jQuery 框架建構出 3D 書本翻頁的效果,主要是想讓使用者能夠有一個友善的介面來觀看網頁上的資料或圖片,以原始的文字和圖片內容來做為書籍的基礎,就像真的在看書一樣左右兩側都會有內容,有導航按鈕在書本的左右兩側,當使用者按下一頁時就會看到以 CSS3 設計的 3D 翻頁特效。當然導航的方式可以隨開發者來自行設計與定義。 ...

Continue Reading

Scroll Follow 能讓網頁的元素跟著使用者移動

下午4:22 / BY Fu
Scroll Follow 跟隨元素 Scroll Follow 是一個能讓網頁的元素跟著使用者移動基於 jQuery 框架開發,簡單容易使用並且兼容於多瀏覽器,可相容於 Opera 9+、Apple Safari、FireFox、Internet Explorer 6+、Google Chrome 等等的近代的瀏覽器使用。 ...

Continue Reading

組合多張圖片以平滑移動瀏覽更有小型的圖片地圖

上午11:24 / BY Fu
Portfolio Image Navigation with jQuery 圖片套件 Portfolio Image Navigation with jQuery 可以組合多張圖片呈現一個圖片地圖,再以上下左右平滑的移動到要看的圖片內容中,可以以分組方式排成一列來區別,在可以以 2D 方式導覽當前的圖片位置上下左右的平滑移動。範例中美麗的圖片是由 Angelo González 所攝影,可以在 Flickr 查看他的作品或者是在 Twitter 搜尋 @ag2r 找到他的作品。 ...

Continue Reading

Zebra_Cookie 簡單容易存取 Cookie 的 jQuery 套件

下午4:25 / BY Fu
Zebra_Cookie 網頁 Cookie 存取套件 在 JavaScript 中如果要處理 Cookie 的時候就需要多很多的動作,而 jQuery 框架也沒有包含 Cookie 的處理功能,所以需要這類型的套件來輔助開發者更加容易地做 Cookie 的處理。Zebra_Cookie 容易讀取、寫入和刪除 Cookie 的動作,非常簡單而且直觀的語法和 jQuery 的寫作方式完美相容,而且套件容量極小化。 ...

Continue Reading

網站倒數計時類似記分版翻頁的效果基於 jQuery 框架

上午9:58 / BY Fu
jQuery 框架 網頁倒數計時器 網站倒數計時類似記分版翻頁的效果基於 jQuery 框架,網站在開戰前如果就開始有宣傳活動,那已經註冊的網域讓別人連不到會降低以後使用者在來訪的意願,如果只是一張 Coming Soon 的圖片又顯得太單調,所以需要用到倒數計時,讓使用者知道多久之後再回來這邊就可以看到他所期待的內容。 ...

Continue Reading

使用 jQuery 框架簡單方便的網頁右鍵選單 contextMenu

中午12:50 / BY Fu
jQuery contextMenu 右鍵選單 使用 jQuery 框架簡單方便的網頁右鍵選單 contextMenu,可以很容易地曾下上下文的右鍵選單,在任何的網頁程序上面,可以讓網頁看起來更像在使用應用程式的感覺。支援鍵盤控制且可無限量的產生自訂的子選單,可使用禁用項目增加和刪除項目讓選單刷新,支援右鍵或左鍵單及控制多元素可共享選單,個別選單可自訂一回調函式。 ...

Continue Reading

圓形縮圖的圖片導覽套件基於 jQuery 框架製作

上午9:54 / BY Fu
Bubbleriffic Image Gallery with jQuery 圖片展示套件 Bubbleriffic Image Gallery with jQuery 建立一連串的氣泡圖片庫列表,以獨特的方式顯示你的圖片。允許使用者移動氣泡列表的圖片滑過放大為整個縮圖,點擊縮圖以圓形的方式放大到整個瀏覽器中並自動調整圖片大小。圓形小縮圖導航可利用滑鼠左右滑動,營照出時尚美麗的導覽列。範例中照片來自 geishaboy500 可以到 Flickr 找到該作者的作品。 ...

Continue Reading

ThickBox 網頁對話框套件可展示圖片和任何的網頁元素

晚上7:16 / BY Fu
ThickBox 3.1 彈出式對話視窗 ThickBox 3.1 網頁對話框套件基於 jQuery 框架開發,可以利用來展示單張或多張的圖片會產生導覽列供瀏覽全部的照片,也可以展示同一個頁面上的任何網頁元素,還能夠使用 iFrame 來連結別的網頁放進對話框中,重要的是還能夠透過 AJAX 的方式取得內容。簡單容易使用並且容量輕巧,壓縮過後的檔案僅 10 K 左右。 ...

Continue Reading

標籤雲( tagcloud ) 球形的標籤套件基於 jQuery 框架

上午11:36 / BY Fu
標籤雲( tagcloud ) 基於 jQuery 框架 標籤雲記得之前有看過的大部分都是以 FLASH 來製作,但是現在大部分的網站設計的人都知道 SEO 的重要性,所以在網頁設計上盡量的減少 FLASH 的數量,改使用 JavaScript 來達到類似的效果。現在要介紹的標籤雲就是其中一個例子,這一個 jQuery 套件讓你網頁的所有標籤文字全部聚在一起就像一個球的形狀,達到既美觀又實用的效果。 ...

Continue Reading

Zebra_TransForm 網頁表單美化 jQuery 框架套件

上午9:40 / BY Fu
Zebra_TransForm 表單美化套件 Zebra_TransForm 使用 jQuery 框架美化網頁選單的選擇框、單選按紐和複選按鈕,以達到跟外觀和感覺他是一個跨瀏覽器的操作,或者讓使用者感覺不是是在網頁而是在使用應用程式的感覺。Zebra_TransForm 是一個很小的 jQuery 套件(壓縮後僅 3 KB),在不犧牲功能和輔助的功能下改變表單元素的外觀設計,可在大部分現代瀏覽器中瀏覽。 ...

Continue Reading

imgCentering.js 讓網頁的圖片列表可依比例壓縮置中對齊

晚上8:22 / BY Fu
imgCentering.js 圖片置中顯示 在設計網頁時,偶爾需要用到圖片的列表來顯示,但是網頁的大小往往都不能夠剛剛好適合你的需要,如果是新網站還比較好控制,那如果是既有的網站改版圖片的比例已經固定了,這個時候你就需要用到,imgCentering.js 讓網頁設的圖片列表可置中對齊又不會讓圖片變形,也不會對伺服器造成負擔,因為主要是使用到了用戶端來做運算。 ...

Continue Reading

Zebra_Accordion 輕量級的手風琴折疊式選單基於 jQuery

下午1:40 / BY Fu
Zebra_Accordion 折疊式選單 Zebra_Accordion 輕量級的手風琴折疊式選單基於 jQuery 框架製作,它定義在一個列表中而且不需要其他任何的特定標記,容易配置完全可以訂製的跨平台的折疊式選單套件。外觀容易使用 CSS 來做訂製,可作用於 FireFox、Opera、Apple Safari、Google Chrome、Internet Explorer 6+近代的瀏覽器中。 ...

Continue Reading

uLightBox 簡單輕巧的對話視窗 - 基於 jQuery 框架

上午10:10 / BY Fu
uLightBox 簡單輕巧的對話視窗 - 基於 jQuery 框架 在設計網頁的時候,有時候會需要用到回覆視窗來跟使用者溝通。但是有時候會覺得瀏覽器預設的彈出視窗沒有那麼好看,所以有了這一個 uLightBox 套件基於 jQuery框架撰寫。這是一個彈出式的對話視窗,可以以黑幕蓋住其他的網頁部分讓使用者不要有別的動作,讓使用者專注在唯一的一個對話框上知道了解你要請使用者作的指令或提示。 ...

Continue Reading

Magnify 圖片放大鏡可以放大圖片局部於旁邊顯示

下午4:08 / BY Fu
Magnify 圖片放大鏡 -  jQuery 套件 設計購物網站時,常常都會覺得圖片的位置不夠用,不能夠讓產品的圖片很漂亮的展示於使用者瀏覽,Magnify 可以讓您輕鬆地建立一個圖片的"放大鏡",您只需要建立一個小型圖片和一個大型圖片大小的比例,相對應的配置您的標記就可以使用了。Magnify 基於 jQuery 框架開發,所以支援大部分的瀏覽器例如:IE6+、FireFox、Apple Safari、Google Chrome等瀏覽器。 ...

Continue Reading

FancyZoom 圖片網頁內容平滑的浮動於當前頁顯示

上午11:11 / BY Fu
FancyZoom 1.1 圖片浮出展示 FancyZoom 是一個可以平滑的放大你網頁上的圖片或任意的 HTML 頁面,專注於流暢且優美的縮放動畫的執行,自動調整圖片的大小,滑鼠移過時就會馬上加載圖片的內容節省下使用者等待的時間。適用於大部分瀏覽器包括:Apple Safari、IE6+、FireFox、Google Chrome。在近代瀏覽器中使用效果最好,因為有使用到 CSS3 的陰影部分。 ...

Continue Reading

jRumble 可以讓網頁上任何的元素產生震動的效果

上午9:13 / BY Fu
jRumble 讓網頁元素有震動效果 jRumble 是一個可以讓網頁上的任何元素產生抖動、震動、搖動特效,可設定多種的方法來產生動畫的特效,使用這些特效的目的是希望可以更加吸引使用者能夠很快的注意到這一個網頁元素。jRumble 基於 jQuery 框架製作可以讓開發者更加容易地為網頁元素增加方法來執行 jRumble 的動畫效果,也因為是使用到了 jQuery 框架,所以對大部分瀏覽器都是有支援的。 ...

Continue Reading

3D Thumbnail hover effects 圖片 3D 動畫摺疊效果

下午4:15 / BY Fu
3D Thumbnail hover effects 圖片 3D 動畫摺疊效果 3D Thumbnail hover effects 滑鼠滑過圖片的所發生的 3D 動畫摺疊效果,建立一個結構將允許我們使用 jQuery 框架使圖片顯示為摺疊或者是彎曲,當使用者的滑鼠滑過時,使用 CSS3 和 jQuery 讓圖片產生 3D 的變化效果。這一個範例因為是使用 CSS3 ,所以並不支援對 CSS3 沒有支援的 IE10 以下的瀏覽器並不支援。 ...

Continue Reading

Zoomer Gallery 建立類似 Flash 的圖片放大效果

中午12:57 / BY Fu
Zoomer Gallery 類似 Flash 放大效果的圖片特效 Zoomer Gallery 建立類似 Flash 的圖片放大效果,可以讓你網站上的圖片在使用者滑鼠滑過的時候,開啟啟動動畫效果去除邊框慢慢放大並且顯示出標題文字,看起的效果就跟 Flash 做出來的沒有兩樣。Zoomer Gallery 使用 jQuery 框架撰寫,支援 IE7+、Google Chrome、Apple Safari 等等的近代瀏覽器。 ...

Continue Reading

Humane JS 沒有使用任何框架開發的提示訊息

上午8:48 / BY Fu
Humane JS  提示訊息可顯示右上方或正上方或者是中間 Humane JS 沒有使用任何 JavaScript 框架開發的提示訊息,簡單、現在化、獨立的程式碼、不占用太大位置的一個提示通知工具,利用 CSS 轉換來製作動畫效果,可支援現在大部分的瀏覽器也包含了現在的移動設備支援。Humane JS 還提供了五種的提示訊息的設計樣式,可在程式進行時隨時的改變提示的外觀設計。 ...

Continue Reading

jQuery.popeye 2.1 可延展顯示大小的圖片展示櫃套件

下午4:31 / BY Fu
jQuery.popeye 2.1 可延展大小的圖片展示櫃 jQuery.popeye 2.1 快速易於安裝又可延展大小的圖片展示櫃套件基於 jQuery 框架開發。可以利用它來節省你網頁上的空間,並且為您的使用者提供了一種漂亮和優雅的方式來顯示縮圖,而且在察看原始圖檔的時候也不需要離開頁面,直接於當頁瀏覽並附有導覽列。快速且易於安裝的原始碼,提供了極大的靈活性、方法和造型。 ...

Continue Reading

YUI Slideshow 簡單方便的圖片展示櫃套件基於 YUI3

下午3:25 / BY Fu
YUI Slideshow 圖片展示櫃 YUI Slideshow 是基於 YUI3 框架所製作而成的圖片展示櫃套件,主要的功能是讓您在設計網站的時候,能夠簡單方便的將所有的 HTML 元素的子元素組成一個可定制的展示櫃動畫。YUI 可能有些人不知道是什麼 Yahoo! UI Library 這是框架的全名,這樣一看就知道了,簡單的說就是 Yahoo 開發的 JavaScript 框架。 ...

Continue Reading

利用 CSS 和 jQuery 框架製作一個漂亮的 Checkbox

上午10:11 / BY Fu
Pretty checkboxes with jQuery 上下為使用前後 在設計表單的時候,偶爾會覺得瀏覽器預設的元件看起來不夠好看也不夠顯眼,可能會讓使用者填寫表單的時候感覺這個網站很一般,跟其他的沒什麼不一樣。Pretty checkboxes with jQuery 這一個主要是設計了一個美觀又大方的表單 Checkbox 元素,讓使用者不只是感覺到不一樣,而且也具備了實用性能夠填入的敘述文字也更多了。 ...

Continue Reading

類似圖片拼圖遊戲的圖片展示效果基於 jQuery 框架開發

下午3:28 / BY Fu
Merging Image Boxes with jQuery 分裂成小縮圖動畫中 Merging Image Boxes with jQuery 以亂數擺放縮圖的角度讓使用者看起來好像是擺放在桌上的照片一樣,當點入一張照片的時候所有的圖片會以動畫方式匯集到中間並且改變圖片內容,轉變成為使用者選重的圖片的那一張大圖,左右會出現上下張的導覽標籤可直些上下張瀏覽,也可以再回到初始的狀態從小縮圖中在瀏覽照片。動畫效果在 Apple Safari 和 Google Chrome 瀏覽最佳。 ...

Continue Reading

rightbox 一個簡單的 Lightbox 由 jQuery + jQuery UI 實現

上午11:29 / BY Fu
rlightbox 輕量級的 Lightbox 基於 jQuery 和 jQuery UI rlightbox 是一個簡單且輕量級的一個 Lightbox 套件基於 jQuery 和 jQuery UI 實現。擁有一些和現在常見的 Lightbox 套件不同的特性,rlightbox 能夠展現出任何的 HTML 內容包括:圖片、影片、Flash檔案和 HTML的內容。rlightbox 有一個更為獨特的全景功能,能夠用於顯示圖片部分,一開始只顯示圖片一某一部分,但是允許使用者平移查看圖片中的其他部分的內容。 ...

Continue Reading

Color Picker 應用在表單元素 SELECT 的顏色選擇器

上午9:49 / BY Fu
Color Picker 顏色選擇器 Color Picker 應用在一般表單元素 SELECT 的顏色選擇器基於 jQuery 框架開發。這意味著 Color Picker 將與大多數的瀏覽器都會相容,在 SELECT 旁會出現一個小圖,點選他就會以淡入淡出的方式顯現出顏色選擇器的主體,SELECT 的顏色內容能夠改變顏色選擇器的小圖顏色,相反的顏色選擇器選擇的數值也能夠改變 SELECT 的色碼。 ...

Continue Reading

Sudo Slider 能透過 AJAX 取得內容加載的內容展示櫃

下午5:29 / BY Fu
Sudo Slider 是一個功能非常豐富的內容展示櫃套件基於 jQuery 框架開發,能夠以各種展現方式來展示任何的 HTML 內容。Sudo Slider 還可以利用 AJAX 加載的方式來展示取得的內容,單一頁面可以放置多個內容展示櫃套件。外觀內容完全可以使用 CSS 來自行定製,內容可垂直水平方向和淡入淡出得過場動畫,支援 IE6+、FireFox、Opera、Apple Safari、Google Chrome等瀏覽器。 ...

Continue Reading

優秀的 CMS 系統 Joomla! 2.5 主程式及中文化安裝教學

上午11:08 / BY Fu
Joomla! 友善的介面 Joomla!是一款優秀的CMS,功能強大、中文支援度不錯,有活躍的社群、討論區等等。Joomla! 2.5 新版本推出一小段時間了,這是下一個階段長期支援的的版本。操作上的一些觀念跟Wordpress差不多,佈景、外掛、模組、文章等等,雖然比較複雜花點時間熟悉一下就不是問題。 ...

Continue Reading

StyleTable 使用 jQuery 框架美化網頁 table 元素

上午9:02 / BY Fu
StyleTable 表單美化 設計網頁的時候,網頁的 table 這一個元素是既方便又複雜的一個東西,很方便就能把你要的資料排列進去,但是雖然是排得很整齊不過表格本身卻又感覺不好看。StyleTable 這一個套件基於 jQuery 框架開發能夠簡單的為 table 網頁元素進行美化的動作,使用方法非常簡單,並且提供了多種的樣式可以選擇。 ...

Continue Reading

Slot Machine Tabs 不同步捲動內容的標籤選單

下午2:09 / BY Fu
Slot Machine Tabs 非同步捲動內容的標籤選單 Slot Machine Tabs 不同步捲動內容的標籤選單,以 jQuery 框架開發。當使用者點下不同的標籤時,標籤的內容會以不同的過場動畫時間來捲動,有點像是玩角子老虎機的感覺,讓使用者在看內容的時候也會感到有趣味性。 ...

Continue Reading

Accordion Menu 折疊式選單套件.基於 jQuery 框架

上午11:39 / BY Fu
Accordion Menu 折疊式選單 Accordion Menu 折疊式選單,在這一個折疊式選單中標題的部分是使用 H3 的網頁標籤,展開的內容子標題是採用 ul 和 li 的網頁標籤組成。一個 CSS 的類別動態的添加到這一個表單當中。標題 H3 標籤點擊來做摺疊選單的開 / 合的動作,一個選單開啟後會關閉其他之前開啟的選單項目。 ...

Continue Reading

Rotating Image Slider 創建非對稱一點點扭曲的圖片展示櫃

上午9:30 / BY Fu
Rotating Image Slider 特殊排列展示櫃 Rotating Image Slider 創建一個非對稱一點點扭曲的圖片展示櫃基於 jQuery 框架,內容圖片以扇狀圖片本身不規則的角度切割,有自動撥放和上下頁導覽的功能更具備了滑鼠滾輪捲動來更換圖片,這一個範例還運用到了一個 jQuery 2D Transformation 的套件主要視角度轉換和動畫效果的套件。圖片授權非商業性使用。 ...

Continue Reading

如何將 Facebook 的紛絲專頁加到網站或者部落格

中午12:45 / BY Fu
粉絲專頁的社群套件 如果你有一個網站或者部落格,並且在 Facebook 擁有粉絲專頁,你想要讓你的網站或部落格中的使用者也能夠看到你在 Facebook 中的動態,或者是想要讓使用者能夠在你的網站中加入你的粉絲團,Facebook 有提供了這樣一個簡單的社群外掛套件,讓所有使用者都能夠簡單的把這一個工具加到你的網站或者部落格當中。 ...

Continue Reading

YoxView 一個可以靈活訂製設定的 Lightbox 套件

上午11:29 / BY Fu
YoxView 網頁內容展示視窗 YoxView 是一個可以靈活訂製設定的一個圖片套件 ( Lightbox ) ,用於展示單張或多張圖片也可展示影片或者是任何的 HTML 元素。可以在一個對話框中利用向前 / 向後的按鈕或者幻燈片的方式來瀏覽圖片。YoxView 支援一個頁面放置多組不同的內容,也可單獨做設定。YoxView 還支援多種語言包含中文,可以透過語言文件訂制。可使用 jQuery 框架也可以不包含框架本身就能更直接的使用。 ...

Continue Reading

EditArea 網頁上的原始碼編輯器.支援多種程式語言

上午10:14 / BY Fu
EditArea 線上原始碼編輯器 EditArea 是一個原始碼編輯器,可支援原始碼格式化,搜尋字詞高亮顯示,文字替換。目前 EditArea 所支援的程式語言包括:PHP、CSS、Javascript、Python、HTML、XML、VB、C、CPP、SQL、Pascal、Basic、Brainf*ck。能夠用來與同伴們共同開發檢討自己的原始碼問題,或者是以此方式來對學生教學等等。 ...

Continue Reading

非同步存取方式存取照片的相片展示櫃 - 基於 jQuery 框架

下午4:23 / BY Fu
Ajaxy Photo Gallery (jQuery) with Custom Images Sets 照片展示櫃 使用 AJAX 建立一個自訂相片內容的相片展示櫃,基於 jQuery 框架製作簡單容易使用,非同步的好處是可以讓使用者感覺網頁開啟較為迅速,不需要等到圖片的網址全部解析完成之後才開始顯示網頁,只需先讀取完靜態的檔案後顯示出來才開始讀取所有圖片的內容,所以使用者本身感覺會比較快。 ...

Continue Reading

jQuery Notty 是一個可以在右上角出現訊息提示的套件

上午11:43 / BY Fu
jQuery Notty 右上角訊息提示視窗 建立互動式網頁時,有時候會需要一些方式來提醒使用者該做別的動作,或者是不要做哪些事情抑或者是提醒使用者一些事情。這個時候 jQuery Notty 就是很好用的一個套件,基於 jQuery 框架製作件單容易使用。還可以設定提示秒數、顯示秒數還有點擊後的回調函示等等的。 ...

Continue Reading

類似 Facebook 右邊廣告會跟著捲動的工具選單

上午9:28 / BY Fu
Portamento 隨卷軸移動的方框 Portamento 類似 Facebook 右邊廣告會跟著捲動的工具選單,不管使用者瀏覽到哪一個段落選單都會一職在旁邊滑動,或者是像 Facebook 一樣做成贊助商的列表,能為贊助商帶來更大的瀏覽版面。Portamento 的工作原理是使用浮動和絕對位置的設計方式,只需要一些簡單的 CSS 和 JavaScript 的程式碼就可以完成了。 ...

Continue Reading

Inset Border Effect 為圖片或網頁元素增加動態邊框

下午4:08 / BY Fu
Inset Border Effect 網頁元素動態邊框 Inset Border Effect 這是一個能夠幫圖片或這是網頁的元素增加一個動態邊框的套件,基於 jQuery 框架製作。當滑鼠移到上面時邊框就會自動消失,當滑鼠移出作用區域時邊框又會自動的增加上去,就跟 CSS 的 hover 的功能基本上是差不多的,只是讓邊框消失或者是重新出現的時候,增強了他的動畫效果,像是淡入淡出之類的。 ...

Continue Reading

Lightbox me 能夠把網頁的 DOM 元素轉變成浮動視窗

下午2:27 / BY Fu
Lightbox me 浮動視窗 在設計網站的時候,是否有想過要把網頁上的某一個 DOM 元素變成一個浮動式的視窗呈現,但又不希望太過花俏。Lightbox me 是一個 jQuery 框架所製成的一個套件,能夠把一個網頁上的 DOM 元素變成一個浮動式的小視窗,當瀏覽器變化時視窗的位置會自動調整。能夠很好的處裡大部分瀏覽器邊界的問題,如視窗調整或視窗比對話框小等等的。 ...

Continue Reading

jCapSlide 浮動於圖片上方的半透明圖層可用於顯示文字

上午10:20 / BY Fu
jCapSlide 浮動於圖片的透明圖層 jCapSlide 能夠建立一個覆蓋在圖片之上的透明圖層,當滑鼠滑過之後才顯示出全部資訊,並不會把圖片本身全部都蓋住。還可以設定圖層的顏色、背景、框線和剛開始是否顯示圖層的設定。基於 jQuery 框架開發,美觀有實用的一個套件程式。 ...

Continue Reading

WowWindow 運用 CSS3 的動畫方式來展示對話視窗

下午5:10 / BY Fu
WowWindow 對話視窗 - 動畫執行中 WowWindow 是一個高級模式對話框的程式類似於 Lightbox 。能夠讓你從圖片、HTML內容或者是影片建立一個可以縮放的對話視窗。WowWindow 運用 CSS3 的過場動畫來展示對話視窗,並不是所有瀏覽器都支援這樣的轉換效果。IE系列瀏覽器因為對 CSS3 的支援太少,所以僅支援 IE9 以上的版本,其他像 Google Chrome、FireFox、Apple Safari 都可以正常支援。 ...

Continue Reading

jPhotoGrid 能把放大的圖片直接放在截圖列表上方

下午3:52 / BY Fu
jPhotoGrid 浮出圖片方便瀏覽 jPhotoGrid 能把放大的圖片直接放在截圖列表上方的一個 jQuery 套件,這個套件可以輸入原始圖片和圖片的介紹文字,並且把介紹文字和放大的圖片放在一個簡單大方的表格之中。所有的外觀設計全部都在 CSS 設計檔之中,主要的就是以絕對定位的方式來做,可以將一張圖片放大供使用者瀏覽,然後再放回原處就像是使用者拿起來看的感覺,主要是利用瀏覽器的圖片縮放的能力作用的是容器的大小。 ...

Continue Reading

jBox 網頁對話視窗基於 jQuery 框架輕鬆簡單方便

下午2:23 / BY Fu
jBox 網頁對話方塊 jBox 是能夠幫您在建置網站的時候,輕鬆地建立對話視窗的一個套件。套件本身建立於 jQuery 框架之下,能夠在警告框和確認框中顯示任意的 HTML 內容包括:文字、圖片和影片等等。對於對話確認之後還有提供回調的方法。 jBox 也支援從其他的 URL 來取得內容,它的外觀介面漂亮而且也可自行訂製不透明度、寬度、提供兩個 skin 供開發者選擇、可拖曳和是否關閉等等的參數設定。 ...

Continue Reading

使用 jQuery 框架和 CSS3 建立的 3D 動態幻燈效果

上午11:40 / BY Fu
jQuery 框架與 CSS3 的結合 使用 jQuery 框架和 CSS3 建立的 3D 動態幻燈效果,範例中建立一個三維動態的滑塊效果所帶來新的轉換功能,用於建立滑塊 CSS 動態調整長條圖的大小,可讓使用者自行調整也可用於調整設定時的動態顯示,讓資料修改也變得不無趣。 ...

Continue Reading

jQuery.Showcase 簡單容易使用的展示櫃套件

上午9:21 / BY Fu
jQuery.Showcase 展示櫃 jQuery.Showcase 簡單容易使用而且強大的圖片展示櫃套件,基於 jQuery 框架開發易於選擇網頁元素內容。支援 FireFox 3.5+、Apple Safari 4.0.4+、Opera 10.10+、IE 7+、Google Chrome 3.0.195+。因為以圖片為主所以最適合拿來做為內部的廣告連結刊登,又大又明顯又可以多筆資料顯示於網頁上,增加使用者對產品的印象。 ...

Continue Reading