JavaScript网页特效经典300例PDF电子书下载

第1篇 JavaScript基础篇 2

第1章 网页特效 2

实例001自动刷新页面 2

实例002让页面后退和前进 3

实例003动态关闭页面 4

实例004页面载入等待界面 5

实例005若干秒后不操作自动关闭窗口 6

实例006修改网页标题 7

实例007禁止网页放入框架 8

实例008跳转到其他页面 9

实例009进入页面时的问候 10

实例010在网页里动态加载JavaScript 11

实例011设为首页 12

实例012收藏本页 13

实例013判断页面是否加载完毕 14

实例014避免浏览器使用缓存加载页面 16

实例015 窗口打开时显示大广告图片及其自动关闭 17

实例016带关闭按钮的右下角图片广告 19

第2章 DOM操作 21

实例017通过id获取网页中的某一部分 21

实例018根据name获取网页中的全部复选框 22

实例019根据标签名获取网页中的多个元素 23

实例020遍历打印一个元素的所有属性 24

实例021遍历HTML文档内容 26

实例022动态创建网页新元素 27

实例023删除元素 28

实例024主动触发按钮的单击事件 29

实例025替换元素内容 31

实例026修改元素的属性值 32

实例027引用同级的元素 33

实例028克隆元素 34

实例029隐藏或显示元素 35

实例030倒排序子元素 36

实例031删除所有的子元素 38

第3章 控制表单控件 40

实例032遍历表单的所有控件 40

实例033通过控件名访问特定的控件 41

实例034修改控件的值 42

实例035获取表单内文本框的个数 44

实例036修改表单的提交方法 45

实例037动态指定表单的动作属性 46

实例038动态选择聚焦的控件 47

实例039初始化表单里的所有控件的值到最初状态 48

实例040为表单加上一个框 50

实例041批量为所有的表单控件加一个说明 51

实例042设置下拉菜单的值 53

实例043使用隐藏控件为表单添加参数 54

实例044勾选全部复选框 55

实例045为表单的聚焦控件设置醒目的样式 57

第4章 窗口的控制和框架的互操作 59

实例046计算窗口内的框架数量 59

实例047父框架对子框架的引用 60

实例048子框架的互相引用 61

实例049用top操作顶部框架 63

实例050确保网页只能被框架载入 64

实例051动态创建框架 65

实例052打开一个新窗口 66

实例053得到是谁打开了子窗口 67

实例054通过子窗口获取数据输入 69

实例055随意改变框架的大小组合 70

实例056巧用self操作当前文档所在的框架或窗口 72

实例057 iframe自适应高度 73

实例058网页打开5秒后弹出广告窗口 75

第5章 鼠标特效 76

实例059禁用鼠标右键 76

实例060动态定义鼠标指针形状 77

实例061鼠标进出时字体大小变化 79

实例062双击鼠标滚动到网页底部 80

实例063当按下鼠标左键时弹出广告窗口 81

实例064鼠标放上链接出现不同的颜色 82

实例065用鼠标拖动图片 83

实例066让鼠标滑轮失效 85

第6章 按钮特效 87

实例067为按钮加上背景颜色 87

实例068自定义按钮的click事件 88

实例069不同的按钮提交不同的表单地址 89

实例070在网页上为用户定义一个打印按钮 90

实例071 Enter键自动提交表单 91

实例072按钮在单击以后就失效 92

实例073删除按钮必需的提醒功能 93

实例074图片式的按钮 94

实例075通过单击按钮改变状态栏信息 95

实例076不同的状态展示不同样式的按钮 96

实例077注册按钮倒计时效果 98

实例078阅读完协议以后才可以单击的注册按钮 99

实例079会变色的按钮 100

第7章 链接特效 102

实例080带下画线的链接 102

实例081改变链接的单击事件 103

实例082关闭窗口的那个“X”链接 104

实例083用链接模拟一个按钮 105

实例084用链接替代表单提交按钮 106

实例085动态修改一个链接的地址 107

实例086让所有链接都在新窗口中打开 108

实例087让页面所有的超级链接都失效 109

实例088为链接地址多加一个参数 110

实例089回到顶部的链接 112

实例090需要确认的链接 113

实例091几条链接交替显示 114

第8章 文本输入框和下拉菜单特效 116

实例092让文本框只带有下画线 116

实例093用正则表达式验证E-mail格式 117

实例094首字母或全部字母大写 118

实例095只能输入数字的文本框 120

实例096判断汉字的个数 121

实例097成为焦点时清除文本框内容 122

实例098动态为下拉菜单设置项目 123

实例099联动的省市下拉菜单 124

实例100三级联动的省市县下拉菜单 126

实例101用户输入完以后立刻进行格式校验 128

实例102鼠标划过文本框改变其背景色 130

实例103输入文字时文本框边框闪烁 131

第9章 层的应用 133

实例104从下往上的信息滚动特效 133

实例105灯箱效果 134

实例106可以拖动的层 136

实例107让层的叠放层次分明 138

实例108随意改变层的尺寸 139

实例109新闻切换特效 140

实例110悬浮的广告层 144

实例111 由左向右地滚动广告 145

实例112右下角的提示层 147

实例113带关闭按钮的右下角提示层 148

实例114底部工具栏 150

第10章 表格的控制 152

实例115 动态地为表格中的单元格文字添加样式 152

实例116动态加入一个新的表格行 153

实例117可变样式的表格边框 154

实例118克隆表格 156

实例119将表格的数据根据某一列排序 157

实例120让表格行的背景颜色间隔开 159

实例121删除表格中的任意一行 161

实例122隐藏表格数据 162

实例123用背景色重点突出表格行 163

第2篇 JavaScript进阶篇 168

第11章 导航菜单特效 168

实例124简单的导航菜单 168

实例125凸显正在浏览的菜单项的导航菜单 169

实例126二级导航菜单 170

实例127三级导航菜单 173

实例128动态加载导航菜单 175

实例129三级联动导航菜单 177

实例130树形导航菜单 180

实例131当网页超过一屏时导航菜单始终置顶 182

第12章 日期和时间特效 184

实例132标题栏显示当前的日期 184

实例133不同时段显示不同的标题欢迎词 185

实例134不同月份显示不同的背景效果 186

实例135倒计时效果 187

实例136查看“今天是否为节假日” 188

实例137每秒刷新的时间展示效果 190

实例138日期输入框 191

实例139使用定时器 194

实例140算出两个时间之间的时间差 195

实例141用表格来完成一个日历特效 196

实例142月底和月初的网页标题各不相同 198

实例143显示登录的时间 199

第13章 样式的操作 201

实例144不同浏览器加载不同的CSS文件 201

实例145动态滤镜效果 202

实例146访问外部定义的CSS样式 203

实例147访问元素中style属性的CSS样式 204

实例148切换样式表 206

实例149让样式动起来 207

实例150同时改变多个DOM的样式 208

实例151隐藏和显示的切换效果 209

实例152用JavaScript代码替代CSS实现链接样式 210

实例153自定义错误样式 212

第14章 网页中变量和函数的应用 214

实例154无处不在的变量 214

实例155应用不同场景的变量类型 215

实例156无所不能的变量载体 216

实例157巧妙地使用内部变量 217

实例158闭包的概念和使用 218

实例159使用动态的函数参数 219

实例160调用动态函数 220

第15章 图片特效 222

实例161仿iPhone图片查看器效果 222

实例162仿QQ空间相册效果 223

实例163放大镜特效 224

实例164让图片保持在层里的上下左右都居中 226

实例165让图片自适应框的大小 228

实例166图片新闻效果 229

实例167为图片加上边框 231

实例168显示图片的局部 232

实例169动态加载图片 233

实例170重新加载验证码图片 234

实例171延迟加载图片 235

第16章 文件和打印的技巧 238

实例172判断文件上传的类型 238

实例173单独打开一个页面来完成打印功能 239

实例174限制多文件上传的文件类型 241

实例175上传图片以后显示缩略图 242

实例176在打印内容里隐藏打印按钮 243

第17章 对象和数组 246

实例177创建自定义对象 246

实例178创建数组的多种方法 247

实例179扩展数组的元素数目 248

实例180在数组的末尾处加入和移除元素 249

实例181在数组的任意位置加入和移除元素 251

实例182把数据转换成对象 252

实例183把数组里的元素按照自然排序 254

实例184数组的本质就是对象 255

第3篇 JavaScript高级篇 258

第18章 Ajax应用 258

实例185创建动态的XMLHttpRequest对象 258

实例186自定义Ajax回调函数 259

实例187自定义Ajax请求方法 261

实例188为Ajax请求添加参数 262

实例189 Ajax请求中的友好等待界面 264

实例190根据不同的HTTP返回代码进行不同的响应 266

实例191 Ajax传输JSON数据实例 268

实例192定义一套自己的Ajax框架 271

第19章 面向对象的特性 273

实例193定义一个类 273

实例194利用prototype为类创建静态成员 274

实例195模拟继承机制 275

实例196为string类型的变量扩展一个replaceAll（）函数 276

实例197为对象扩展一个动态属性 277

实例198为对象扩展一个方法 279

第20章 经典 JavaScript框架应用 281

实例199框架对JavaScript编码的意义 281

实例200 Prototype让 JavaScript面向对象 282

实例201利用Prototype实现继承机制 283

实例202用Prototype来包装JavaScript事件 284

实例203用Prototype轻松获取DOM的实际尺寸 285

实例204用Dojo动态创建层的DOM 287

实例205用Doj o动态指定按钮的click事件 288

实例206用Dojo隐退图片 289

实例207用Doj o轻松实现元素的拖曳 290

实例208利用YUI来动态监听单击事件 291

实例209利用YUI模拟向左滑动以删除菜单项 292

实例210利用YUI实现被单击按钮样式突出的效果 294

实例211利用YUI实现网页元素隐藏和显示的切换 295

实例212利用YUI实现层的收缩隐藏特效 297

实例213利用YUI实现层的随意拖动效果 298

实例214利用YUI实现图片的滚动延迟加载 299

实例215 利用YUI随意改变层的尺寸 300

第21章 jQuery的妙用 302

实例216选择所有的元素 302

实例217选择相同标签的元素 303

实例218选择相同class的元素 304

实例219快速选择表单元素 305

实例220选择所有已勾选的复选框 306

实例221指定下拉菜单的已选项 307

实例222选择包含特定内容的层 308

实例223修改元素属性的值 309

实例224获取和指定元素的内容 310

实例225一次选择多个不同类的元素 311

实例226删除部分文档内容 313

实例227一次选择多个不同类的元素 314

实例228快速修改样式规则 315

实例229获取实际元素的高度和宽度 316

实例230指定页面加载完成的回调 317

实例231为元素动态添加某种事件 318

实例232隐藏或显示元素 319

实例233滑动效果 320

实例234淡入效果 321

实例235让Ajax如此简单 322

实例236使用Ajax获取JSON数据 323

第22章 丰富的jQuery插件应用 324

实例237带伸缩功能的内容分段 324

实例238带自动提示功能的文本输入框 325

实例239多功能按钮 326

实例240自定义格式的日期输入框 328

实例241选择日期段 329

实例242自定义提示框 331

实例243轻松实现层的拖动功能 332

实例244多级菜单 333

实例245用幻灯片方式浏览图片 335

实例246进度条 337

实例247可改变大小的层 338

实例248可被选择的菜单项 339

实例249滑块效果 341

实例250选择范围的滑块效果 342

实例251可排序的列表 343

实例252可拖动的选择项 344

实例253数字输入框 346

实例254时间输入框 347

实例255多页切换效果 348

实例256带提示信息的输入框 350

第23章 HTML5的新应用 351

实例257视频尺寸动态修改示例 351

实例258动态播放或暂停视频 352

实例259指定视频的播放进度 354

实例260隐藏音频播放器的控制按钮 355

实例261拖动页面上的元素 356

实例262让图片不可以拖动 358

实例263使用canvas画一个矩形图案 359

实例264使用canvas画一个圆形图案 360

实例265用HTML5绘制一个SVG标量圆形 362

实例266获取用户当前的地理坐标 363

实例267根据地理信息定位城市 364

实例268在地图上标识附近加油站的地址 365

实例269使用localStorage实现计数器 366

实例270使用sessionStorage实现计数器 367

实例271使用Web Worker为学生考试计时 368

第24章 CSS 3带给我们的新体验 371

实例272圆角边框 371

实例273图形边框 372

实例274图片阴影效果 373

实例275文字阴影效果 374

实例276带有可见度的背景颜色 375

实例277多列显示文字 377

实例278使用CSS 3实现过渡效果 378

实例279使用CSS 3实现动画效果 379

实例280使用CSS 3实现图片旋转效果 380

实例281可移动的图片 382

实例282放大和缩小图片 383

实例283扭曲的图片 384

实例284让图片立体旋转 385

第25章 JavaScript在智能手机上的应用 387

实例285判断是否为移动浏览器 387

实例286测试是否支持滑动事件 388

实例287通过滑动修改网页字体大小 390

实例288用手势来改变图片大小 392

实例289用手势改变图片的显示方向 393

实例290使用手机GPS定位用户所在城市 395

第26章 其他应用和技巧 397

实例291利用浏览器的cookie保存用户名 397

实例292 eval（）函数大行其道 399

实例293妙用正则表达式来减少JS代码 400

实例294按拼音首字母排序 402

实例295用try和catch来让程序更友好 403

实例296不用Ajax也可以达到不刷新页面的效果 405

实例297让输入的英文字母自动变成大写 406

实例298用JSON格式来保存数据 407

实例299得到用户显示器的最大分辨率 409

实例300用JavaScript实现的抽奖程序 410