Posts belonging to Category 'javascript'

圖片透明倒影 Reflection

套件名稱:Reflection
版本: 2.0
說明:
Reflection.js 是一個只有 5Kb 的javascript套件,Reflection 可以產生圖片半透明、倒影等效果,運用的方式也很簡單,請見以下步驟。

1. 嵌入 Reflection.js 套件

<script type="text/javascript" src="reflection.js"></script>

2. 在要產生倒影的圖片上加入 class=”reflect” ,即可以產生倒影效果。

3. 其他選項的效果如 class="reflect rheight33 ropacity33"
rheight33:指的是倒影的高度為33%,當然你可以指定rheight40,rheight66或rheight100
ropacity33: 指的是不透明程式為33%,數值越小透明程式越高

更詳細的說明請參考 Reflection說明Reflection的demo

VN:F [1.8.1_1037]
Rating: 6.2/10 (5 votes cast)
VN:F [1.8.1_1037]
Rating: 0 (from 0 votes)
  • Share/Bookmark

javascript 簡體中文手冊

javascript 簡體中文手冊

JScript中文參考手冊

VN:F [1.8.1_1037]
Rating: 0.0/10 (0 votes cast)
VN:F [1.8.1_1037]
Rating: 0 (from 0 votes)
  • Share/Bookmark

progress bar 多個進度條效果

套件名稱:progress
範例說明:
本文章示範多種進度條效果。

jsProgressBarHandler – 是一款以 prototype 為基礎的進度條效果。  demo按我
jsProgressBarHandler1

jQuery progress bars – 一個可以顯示上傳進度條的 jQuery 套件。     demo 按我
jquery_progress_bars

VN:F [1.8.1_1037]
Rating: 0.0/10 (0 votes cast)
VN:F [1.8.1_1037]
Rating: 0 (from 0 votes)
  • Share/Bookmark

浮動視窗效果

套件名稱:growl
版本:2.0
需求:mootools-1.2b2
範例說明:
growl 2.0 是一款以 mootools 為基礎的套件,growl 可以產生浮動視窗效果。
按我demo

VN:F [1.8.1_1037]
Rating: 0.0/10 (0 votes cast)
VN:F [1.8.1_1037]
Rating: 0 (from 0 votes)
  • Share/Bookmark

jQuery Gallery 圖片動畫顯示集

套件名稱:jQuery Gallery
系統需求:jQuery

本文章集合一些 jQuery 運用在圖片上的效果。

Space Gallery – 是一款很炫用 3D 方式顯示圖片的效果。  demo按我

jQuery Cycle Plugin - 是一款值得推薦的圖片顯示效果,輕巧且包含很多顯示效果。

EOGallery – 是一款結合 jQueryCody Lindley 和 Thickbox 顯示圖片效果的套件。

piroBox – 也是一款非常特別的顯示效果。

zoomimage – 也是一款挺特別的秀圖套件。

MooFlow – 再推一款超酷的show圖程式,不但有魚眼效果,還可以使用滑鼠中間的滾輪瀏覽圖片喔。  按我demo

VN:F [1.8.1_1037]
Rating: 0.0/10 (0 votes cast)
VN:F [1.8.1_1037]
Rating: 0 (from 0 votes)
  • Share/Bookmark

很酷的滑動效果 coda-slider

套件名稱:coda-slider
系統需求:jQuery

套件說明:1..1.1
demo: 本地demo
coda-slider 是一款可以將文章做滑動效果的 jQuery 插件。

VN:F [1.8.1_1037]
Rating: 0.0/10 (0 votes cast)
VN:F [1.8.1_1037]
Rating: 0 (from 0 votes)
  • Share/Bookmark

jQuery checkbox樣式修改

套件名稱:jQuery-checkbox
系統需求:jQuery

套件說明:1.3.0b1
demo:  本地demo
jQuery-checkbox 是一個修改 checkbox 樣式的 jQuer插件,修改的樣式如下所示。

VN:F [1.8.1_1037]
Rating: 0.0/10 (0 votes cast)
VN:F [1.8.1_1037]
Rating: 0 (from 0 votes)
  • Share/Bookmark

jQuery 樹狀檔案

套件名稱:jQuery File Tree
系統需求:jQuery

套件說明:1.01
demo:http://abeautifulsite.net/notebook_files/58/demo/
套件下載:按我下載
jQuery File Tree 是一個用樹狀方式呈式檔案模式的套件,其中有一些不同呈現的效果,請見底下的demo。

VN:F [1.8.1_1037]
Rating: 0.0/10 (0 votes cast)
VN:F [1.8.1_1037]
Rating: 0 (from 0 votes)
  • Share/Bookmark

jQuery 顯示訊息的效果

1. 顯示訊息時背景會慢慢變白,訊息視窗可以設定幾秒後關閉。
詳細demo請按我

2. 訊息顯示後,當有事件發生時,訊息會自動消失。
詳細demo請按我

VN:F [1.8.1_1037]
Rating: 8.8/10 (4 votes cast)
VN:F [1.8.1_1037]
Rating: +1 (from 1 vote)
  • Share/Bookmark

可以針對任何元件產生陰影效果的特效

可以針對任何元件產生陰影效果的特效
系統需求:jQuery

套件說明:
本範例針對文字、圖片、div、text、textarea、button等元件產生陰影效果的範例。

執行結果: demo請按我
shadow

VN:F [1.8.1_1037]
Rating: 10.0/10 (1 vote cast)
VN:F [1.8.1_1037]
Rating: 0 (from 0 votes)
  • Share/Bookmark