~~~
用jQuery寫的簡單的圖片變化且帶alpha濾鏡的動態效果
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Alpha.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<mce:script type="text/javascript" src="extjs/adapter/jquery/jquery.js" mce_src="extjs/adapter/jquery/jquery.js"></mce:script>
<mce:script type="text/javascript">
<!--
var ary = ["red", "blue", "#CCFFFF", "#99FFCC"];
var imgAry = new Array();
imgAry.push("http://hiphotos.baidu.com/%BA%EC%C2%A5%C7%E9%C3%CE/pic/item/ed9e7094af4f2677d1135e93.jpg");
imgAry.push("http://hiphotos.baidu.com/%BA%EC%C2%A5%C7%E9%C3%CE/pic/item/cf4013658b43f3ccf7365493.jpg");
imgAry.push("http://hiphotos.baidu.com/%BA%EC%C2%A5%C7%E9%C3%CE/pic/item/2f78156fb7c8dae681cb4a93.jpg");
imgAry.push("http://hiphotos.baidu.com/%BA%EC%C2%A5%C7%E9%C3%CE/pic/item/ed9e7094af1f2677d0135e23.jpg");
var i = 0;
$(function () {
$("div").css("width", "300px").css("height", "200px").css("border", "1px solid red");
$("img").css("width", "200px").css("height", "200px")
.css("filter", "progid:DXImageTransform.Microsoft.Alpha(startX=0, startY=0, finishX=100, finishY=100,style=3,opacity=0,finishOpacity=100)");
/*
調節style=3,opacity=0,finishOpacity=100這三個值改變效果，
style 漸變樣式 0，1，2，3
opacity開始透明度 0 25 50 75 100
finishOpacity結束透明讀0 25 50 75 100
*/
show();
});
function show () {
$("div").css("background-color", ary[i]);
$("img").attr("src", imgAry[i]);
i++;
if (i > ary.length - 1) {
i = 0;
}
setTimeout("show()", "1000");
}
// -->
</mce:script>
</head>
<body>
<div>
<img src="http://hiphotos.baidu.com/%BA%EC%C2%A5%C7%E9%C3%CE/pic/item/cf4013658b43f3ccf7365493.jpg" mce_src="http://hiphotos.baidu.com/%BA%EC%C2%A5%C7%E9%C3%CE/pic/item/cf4013658b43f3ccf7365493.jpg"/>
</div>
</body>
</html>
~~~
- 前言
- jQuery 變動圖片、濾鏡效果
- jQuery javaScript js 判斷瀏覽器的類型、版本的方法
- jQuery 設置表格隔行變色、隔列變色
- jQuery 可編輯表格文本域，支持鍵盤快捷操作
- jQuery 中常用的插件列表
- 共享你的jquery 插件
- extJS checkBoxColunmTree 可以選擇帶checkBox的樹（tree、grid）
- jquery tab 選項卡功能
- jQuery autocomplete 自擴展插件、自動補全示例
- jquery blockUI 擴展插件 Dialog
- jQuery 獲取屏幕高度、寬度
- JavaScript/jQuery、HTML、CSS 構建 Web IM 遠程及時聊天通信程序
- Web 通信 之 長連接、長輪詢（long polling）
- 幾款極好的 JavaScript 文件上傳插件
- 60款很酷的 jQuery 幻燈片演示和下載