层的显示隐藏特效.pptVIP

CSS样式特效 第三章 回顾 window对象有哪些常用的方法及其含义？ 请说明Date对象主要用来做什么？ 请详细解释setTimeout( )方法的功能。 详述getElementById( )的主要功能 详述getElementsByName( )的主要功能 简述制作浮动广告图片的实现思路 制作实现全选效果-1 如何实现如图所示的全选或全不选效果？ 全选效果 全不选效果 制作实现全选效果-2 1、复选框是否选中的属性是哪个？ 2、写代码逐个复选框设置为true，有没有更好的办法？ checked属性 解决办法: 使用复选框数组， 通过循环给checked属性赋值 制作实现全选效果-3 实现思路： 创建一组同名的复选框 编写脚本 1、使用getElementsByName( )方法获得一组同名的复选框对象。 2、通过循环来改变复选框是否被选中属性checked的值。 制作实现全选效果-4 SCRIPT language=javascript function checkAll(boolValue ) { var allCheckBoxs=document.getElementsByName(isBuy) ; for (var i=0;iallCheckBoxs.length ;i++) { if(allCheckBoxs[i].type==checkbox) allCheckBoxs[i].checked=boolValue ; } } /SCRIPT …… TR TD width=6%A href=javascript: checkAll(true)全选 /TD TD width=6%A href=javascript: checkAll(false)全不选 /A/TD TD width=88%IMG src=images/top.jpg width=845 height=18/TD /TR …… 判断同名元素中是否是复选框 是复选框就改变是否选中属性checked的值 实现全选效果（二） function selectAll(che) { var list=document.getElementsByTagName(input); for(i=0;ilist.length;i++) { if(list[i].type==checkbox) { list[i].checked=che.checked; } } } input id=Checkbox1 type=checkbox onclick=selectAll(this)/all 小结 1 用以上两种方法实现全选/全不选 本章任务 页面效果 页面效果 制作51job的弹出层效果 制作改变边框样式、按钮图片样式的特效 本章目标 会使用style样式属性动态改变边框颜色 会使用className类名属性动态改变按钮背景图片 会使用display显示属性实现层或图片的隐藏/显示和切换特效 回顾已学的CSS样式表-1 样式规则的语法是什么？用法有哪些？ 行内样式 内嵌样式 外部样式表 回顾已学的CSS样式表-2-1 回顾HTML中讲过的CSS样式表，常见的样式有哪些？ 常见 样式 文本属 性样式 背景属 性样式 不带下划 线的超连 接样式 细边 框样式 图片按 钮样式 回顾已学的CSS样式表-2-2 文本属性 说 明 font-size 字体大小 font-family 字体类型 font-style 字体样式 color 设置或检索文本的颜色 text-align 文本对齐 背景属性 说 明 background-color 设置背景颜色 background-image 设置背景图像 background-repeat 设置一个指定的图像如何被重复 回顾已学的CSS样式表-2-3 名称 说 明 不带下划线的超连接 A { color: blue; text-decoration: none;} A:hover{ color: red; text-decoration: underline; } 细边框样式 .boxBorder { border-width:1px;