JavaScript网页特效实例大全

第1篇 JavaScript网页实例

第1章 页面类特效（教学视频：19分钟）

1.1 背景颜色在线改变 2

1.2 舞台效果 3

1.3 下雨的页面效果 6

1.4 QQ式页面导航栏 8

1.5 拉幕效果 10

1.6 使用调色板更换页面背景 11

1.7 飞舞的星星 13

1.8 选择进入页面的效果 15

1.9 网页加载效果 15

1.10 自动滚屏页面 16

1.11 QQ客服随屏页面效果 17

1.12 雪花纷飞的页面 19

1.13 MSN消息提示效果 21

1.14 自动最大化页面 22

1.15 自动刷新页面 23

1.16 页面的前进与后退 23

1.17 保护页面内容不被复制 24

1.18 保护页面源代码不被复制 25

1.19 保护页面不被其他网站使用框架加载 25

1.20 在页面中调用其他网页 26

1.21 倒计时 26

1.22 载入页面时显示滚动条 28

1.23 禁用页面另存功能 29

1.24 禁用页面被加载到缓存中 30

1.25 打开页面时弹出对话框 30

1.26 自动收藏当前页面 31

1.27 自动设定当前页面为默认加载页面 31

1.28 冻结窗口 32

1.29 禁用页面中的脚本 33

1.30 随机修改页面标题 33

1.31 页面中的播放器 34

1.32 页面信息的传递 35

1.33 批量访问页面元素 36

1.34 改变页面元素位置 36

1.35 页面动画 37

1.36 页面元素拖曳 38

1.37 页面颜色渐变 40

1.38 基于浏览器类型的重定向 43

1.39 页面加载后自动播放声音 43

1.40 显示页面最后修改时间 44

1.41 页面状态栏实时显示当前时间 44

1.42 页面的前进、后退与刷新 45

1.43 页面定时弹出窗口 46

1.44 将页面上过长的字符串按长度要求超出部分显示省略号 46

1.45 页面树形菜单 47

第2章 按钮特效（教学视频：15分钟） 49

2.1 改变页面某列表框控件的内容时，显示不同的按钮 49

2.2 按钮热键 50

2.3 确认某个动作前的提示按钮 51

2.4 图形按钮 51

2.5 平面按钮 52

2.6 嵌入按钮 53

2.7 通过按钮刷新页面 53

2.8 禁止按钮连击 54

2.9 底部显示文字的按钮 55

2.10 动态创建按钮 55

2.11 通过按钮改变状态栏 56

2.12 通过按钮控制文本产生渐变效果 56

2.13 按钮获取焦点 58

第3章 按键屏蔽特效（教学视频：10分钟）

3.1 屏蔽键盘所有键 59

3.2 屏蔽鼠标右键 59

3.3 屏蔽F5键刷新页面 60

3.4 屏蔽浏览器右上角“最小化”、“最大化”和“关闭”按钮 60

3.5 屏蔽退格键 61

3.6 屏蔽IE后退按钮 61

3.7 屏蔽主窗口滚动条 61

3.8 抓屏并不断地清空剪贴板 62

3.9 屏蔽网站的打印功能 62

3.10 屏蔽IE浏览器中图片上自动出现的保存图标 62

3.11 屏蔽网页中所有的脚本 63

第4章 验证码特效（教学视频：21分钟）

4.1 限制长度 64

4.2 限定汉字 65

4.3 限定英文 65

4.4 限定数字 66

4.5 限定英文和数字 66

4.6 验证邮箱格式 67

4.7 屏蔽关键字 68

4.8 验证两次输入的密码是否相同 69

4.9 验证表单项不为空 70

4.10 比较两个表单项的值是否相同 71

4.11 验证表单项只能为数字和下划线 72

4.12 限定表单项输入值或长度 73

4.13 限定表单项不能输入的字符 74

4.14 检查一段字符串是否全由数字组成 74

4.15 判断是否是字符 75

4.16 验证电话号码格式 76

4.17 判断输入是否为中文 77

4.18 判断用户名是否为数字、字母、下划线 78

第5章 鼠标特效（教学视频：18分钟）

5.1 鼠标单击图片后切换为其他图片 79

5.2 鼠标单击小图无刷新放大图片 79

5.3 鼠标放到图片上会滑出提示文字 80

5.4 鼠标放上图片错位效果 82

5.5 鼠标经过时产生浮动层放大图像 82

5.6 鼠标经过图片放大效果 83

5.7 鼠标经过图片更换图片 84

5.8 鼠标经过图片时，下方出现注释 85

5.9 鼠标经过时，图片由灰色变彩色 86

5.10 图片在鼠标的控制下横向滚动 86

5.11 鼠标拖动图片 89

5.12 鼠标拖动时图片自由变化大小 91

5.13 鼠标移出图片抖动 91

5.14 图片透明度随着鼠标移入移出而改变 93

5.15 鼠标移入缩略图显示出大图 94

5.16 图片在鼠标移入时变清晰 96

5.17 图片边框在鼠标经过时变色 97

5.18 在网页上单击鼠标的地方显示图片 97

5.19 鼠标滑入时图片变清晰，鼠标划出时图片变模糊 98

5.20 图片响应鼠标特效 99

5.21 鼠标滑入动画加载大图 100

5.22 鼠标滑过图片出现边框 104

5.23 鼠标滑入图片改变透明度 104

5.24 缩略图响应鼠标滑入图片切换 105

5.25 鼠标滑入后悬停，图片交换 108

5.26 鼠标滑入小图，跟随鼠标移动展示大图 109

5.27 带图片的鼠标悬停提示 111

5.28 响应鼠标变化的绚丽图片特效 112

5.29 感应鼠标的图片遮罩动画效果 115

5.30 鼠标滑入变换内容 116

5.31 跟随鼠标旋转的星星 117

5.32 鼠标滑入图片渐变高亮 119

5.33 图片感应鼠标的虚实效果 120

5.34 鼠标单击控制图片左右滚动 120

5.35 全面禁用鼠标右键 124

5.36 全面禁用鼠标滚轮 124

5.37 全面禁用鼠标右键复制粘贴 125

5.38 跟踪鼠标显示坐标 126

5.39 围绕鼠标跳跃的文字 127

5.40 鼠标移入移出某个区域时改变颜色 128

5.41 鼠标移入移出时控件特效 128

5.42 跟随鼠标的汉字 129

5.43 跟随鼠标的小点点 131

5.44 跟随鼠标漂移的文字 132

5.45 鼠标燃放烟花 133

5.46 带时钟的鼠标 137

5.47 吐泡泡的鼠标 141

5.48 会变化的鼠标指针 143

5.49 跟踪鼠标的雪花 143

第6章 类淘宝特效（教学视频：11分钟）

6.1 类淘宝图片切换，类似相册播放效果 146

6.2 淘宝网宝贝图片预览效果 149

6.3 淘宝网广告图片幻灯效果 151

6.4 淘宝网图片幻灯片上下滚动切换效果 153

6.5 淘宝式导航条 155

6.6 淘宝式选择菜单 156

6.7 淘宝产品列表的显示与隐藏 159

6.8 淘宝网纵向分类菜单 160

6.9 淘宝的地区选择菜单 162

第7章 各类网站特效（教学视频：21分钟）

7.1 广告图片上下滚动替换 164

7.2 仿Flash广告图片左右滚动替换的效果 165

7.3 广告图片渐变翻页效果 168

7.4 照片分享网站的图片预览效果 169

7.5 图片滑动放大效果 170

7.6 Google牛顿纪念日苹果下落特效Logo 172

7.7 运用marquee标签的图片滚动特效 173

7.8 仿NBA网站图片切换 174

7.9 仿nVida网站图片滑动切换 176

7.10 盯着你看的眼睛Logo 177

7.11 仿FLASH图片光照特效 179

7.12 心形屏保效果 179

7.13 仿天极网首页幻灯图片切换特效 182

7.14 百度图片切换特效 184

7.15 腾讯图片滑动切换特效 185

7.16 仿新浪焦点图变换自动切换大图效果 188

7.17 搜狐女人频道首页的图片切换效果 190

7.18 腾讯商品图片滚动效果 192

7.19 腾讯网站的图片切换效果 193

7.20 天极网图片切换效果 195

第8章 焦点图特效（教学视频：7分钟）

8.1 焦点图片切换过程自动变更切换效果 197

8.2 单击小图弹出大图 199

8.3 动感图片标题的焦点图切换 201

8.4 带加载过程的焦点图片切换效果 204

8.5 简洁的鼠标滑入焦点图切换效果 206

第9章 图片特效（教学视频：20分钟）

9.1 图片的渐显效果 208

9.2 图片放大查看特效 209

9.3 图片滚动展示 210

9.4 图片滚动酷炫效果 211

9.5 图片垂直和水平翻转效果 211

9.6 图片放大效果 212

9.7 图片幻灯效果 215

9.8 图片扭曲变形效果 217

9.9 图片淡入淡出切换特效 218

9.10 图片无缝滚动 220

9.11 图片90°旋转 222

9.12 图片选择器 223

9.13 图片预加载 226

9.14 图片预加载复杂效果 227

9.15 图片的渐隐渐现效果 228

9.16 图片翻页效果 229

9.17 图片放大效果 230

9.18 图片自右向左滚动 231

9.19 图片在按钮控制下左右无缝滚动效果 232

9.20 图片自动滚动效果 236

9.21 图片横纵向同时滚动效果 237

9.22 图片在鼠标控制下连续左右滚动效果 239

9.23 图片悬停滚动切换效果 241

9.24 图片随着鼠标滑入缩略图切换效果 245

9.25 图片快速移动切换效果 247

9.26 图片通过悬浮的左右箭头切换效果 248

9.27 图片简单切换效果 251

9.28 图片渐现加载效果 252

9.29 图片可控垂直无缝滚动效果 253

9.30 图片自动上翻效果 255

9.31 图片水平切换效果 257

9.32 图片左右浮动效果 258

9.33 图片垂直滚动效果 260

9.34 图片杂色效果 264

9.35 箭头图片控制内容框内容滚动 265

9.36 图片光影效果 266

9.37 图片走马灯效果 267

9.38 图片通过缩略图切换效果 268

9.39 图片雷达扫描效果 269

9.40 图片闪动效果 270

9.41 图片在鼠标滑入时垂直滚动 271

9.42 图片垂直浮动效果 272

9.43 图片随机切换效果 273

9.44 图片立体椭圆轨迹旋转切换效果 274

9.45 图片向上无缝滚动效果 277

9.46 图片向下无缝滚动效果 278

9.47 图片向左无缝滚动效果 279

9.48 图片向右无缝滚动效果 280

9.49 网页背景图片通过单击缩略图切换效果 281

9.50 图片漂浮效果 281

9.51 图片放入椭圆中 283

9.52 滚动波浪效果 283

9.53 图片探照灯效果 285

9.54 图片变换位置浮现效果 285

9.55 禁止下载图片 287

9.56 图片弹跳效果 287

9.57 旋转圆圈效果 290

9.58 穿越星空效果 292

.......

第10章 文字特效（教学视频：25分钟）

第11章 链接特效（教学视频：18分钟）

第12章 文本框特效（教学视频：14分钟）

第13章 时间特效（教学视频：18分钟）

第14章 数字特效（教学视频：19分钟）

第15章 控件特效（教学视频：17分钟）

第16章 密码特效（教学视频：11分钟）

第2篇 jQuery特效实例

第17章 JavaScript与CSS结合特效（教学视频：20分钟）

第18章 jQuery特效（教学视频：20分钟）

第3篇 Active技术的应用

第19章 JavaScript与ActiveX技术（教学视频：13分钟）

第20章 JavaScript操作数据库（教学视频：7分钟）

附录A JavaScript对象模型图 640

附录B JavaScript事件大全 641

本书全面介绍了500余个JavaScript网页特效实例，涉及JavaScript的基本知识、高级技巧和核心原理，基本涵盖了JavaScript开发的所有重要知识和特效实例，而且还介绍了jQuery特效实例、JavaScript和CSS结合特效实例及Active技术应用等。本书实例典型，实用性强，可以作为每个网页开发人员的案头必备手册。另外，本书免费赠送大量的网页制作与开发专题教学视频库、实例资源库及案例资源库，需要的读者可按本书封底的提示自行下载。本书共20章，分为3篇。第1篇介绍JavaScript网页特效实例，涵盖421个实例，包括页面类特效、按钮特效、按键屏幕特效、验证码特效、鼠标特效、类淘宝特效、各类网站特效、焦点图特效、图片特效、文字特效、链接特效、文本框特效、时间特效、数字特效、控件特效、密码特效；第2篇介绍jQuery特效实例，涵盖74个实例，包括JavaScript与CSS结合特效、jQuery特效；第3篇介绍Active技术应用，涵盖12个实例，内容包括JavaScript与ActiveX技术、JavaScript操作数据库等。本书适合所有想全面学习JavaScript开发的人员阅读，尤其适合用JavaScript进行网页特效开发的人员。对于经常使用JavaScript进行网页编程的人员，本书更是一本不可多得的案头必备参考手册。

最全面的JavaScript网页特效开发实例书籍。
全面介绍了500余个网页特效实例，可作为每个网页开发人员的案头必备手册。
·涵盖网页开发中最常见的JavaScript特效实例、jQuery特效实例及JavaScript结合CSS特效实例等。
·每个实例都提供了详细的源代码，只需要对这些源代码稍加修改，便可直接用于实际开发，可大大提高开发效率。·讲解时穿插了大量的网页开发技巧，可以让读者掌握一些快捷编程的方法，从而在短期内迅速提高开发水平。
海报：