按类型可以分为下面几大类的特效集合：
Ui 类的：
背景
对话框
筛选及排序
反馈
弹出层
悬停
布局
图表
加载
圆边
滚动
标签
文本链接
工具提示
网络类型
输入类型的：
拾色器
定制和风格
日期和时间
拖和放
通用输入
自动完成
密码
投票率
搜索
选择框
快捷键
触摸
丰富的输入
上传
验证
媒体类型：
音频和视频
幻灯片和轮播图
图片展示
图像
地图
滑块和旋转
Tabs
导航：
水平导航
垂直导航
文件树
分页
手风琴菜单
其他
JS特效就是网页中实现的特殊效果或者特殊的功能的一种技术,是用网页脚本(javascript)来编写制作动态特殊效果。
比如图片切换，渐变等等，它为网页活跃了网页的气氛，有时候会起到一定的亲切力。
JavaScript 是根据 "ECMAScript"标准制定的网页脚本语言。这个标准由 ECMA 组织发展和维护。ECMA-262 是正式的 JavaScript 标准。
扩展资料：
能够具有交互性，能够包含更多活跃的元素，就有必要在网页中嵌入其它的技术。如：Javascript、VBScript、Document Object Model（DOM，文档对象模型）、Layers和 Cascading Style Sheets（CSS，层叠样式表）。
JavaScript 使网页增加互动性。JavaScript 使有规律地重复的HTML文段简化，减少下载时间。JavaScript 能及时响应用户的操作，对提交表单做即时的检查，无需浪费时间交由 CGI 验证。JavaScript 的特点是无穷无尽的，只要你有创意。
N年前做了一个，你看这个如何？演示地址：http://test.pc365.net/light.htm
(如打不开，请多刷新几次)
代码如下：
===========================================================
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">
<title>烛光效果</title>
<STYLE>
.drag
{CURSOR: hand
POSITION: relative
filter:blur(strength=12)
}
</STYLE>
<SCRIPT language=JavaScript>
var dragapproved=false
var z,x,y
function move()
{
if(event.button==1&&dragapproved)
{z.style.pixelLeft=temp1+event.clientX-x
z.style.pixelTop=temp2+event.clientY-y
movelight(z.style.pixelLeft,z.style.pixelTop)
return false
}
}
function drags()
{
if(!document.all) return
if(event.srcElement.className=="drag")
{
dragapproved=truez=event.srcElement
temp1=z.style.pixelLeft
temp2=z.style.pixelTop
x=event.clientXy=event.clientY
document.onmousemove=move
}
}
function setlight(xx,yy)
{
// main.filters.light(0).addambient(235,239,129,110)
main.filters.light(0).addpoint(xx,yy,50,235,239,169,100)
//x坐标，y坐标,扩散范围,颜色,颜色,颜色,强度
//main.filters.light(0).addcone(xx,yy,0,100,100,200,204,200,180,20)
}
//第一个参数：光源的X坐标；第二个参数：光源的Y坐标；第三个参数：光源离开页面的高度；
//第四至第六个参数：光源的颜色；第七个参数：光源光的色相；第八个参数：光源的形状；
//第九个参数：光源的光的强度 ；第十个参数：光源光散开的范围。
function movelight(xx,yy)
{
xx+=400
yy+=50
main.filters.light(0).clear()
setlight(xx,yy)
}
document.onmousedown=drags
document.onmouseup=new Function("dragapproved=false")
</SCRIPT>
</head>
<body bgcolor="#000000" topmargin="0" leftmargin="0">
<div id='Layerw' style='position: absoluteleft: 0top:50width: 100%height: 40z-index: 1' align="center">
<img src="http://test.pc365.net/lz.gif" alt="蜡烛照明 拖动使用" class=drag width="98" height="120">
</div>
<div align="center" >
<center>
<table id="main" border="0" width="780" cellpadding="0" cellspacing="0" height="580" background="images/house.gif" style="filter:light">
<tr >
<td width="100%">
<p align="center"><img id="pt" border="0" src="http://test.pc365.net/123456.jpg" ></p>
</td>
</tr>
</table>
</center>
</div>
</body>
</html>
<script>setlight(400,50)</script>
