JavaScript程序设计课件：第十章 JavaScript应用与实践.ppt

文字特效 文字色彩 例10.2是一个文字色彩效果的实例，代码见教材P209。 简化的例子是ex10-2-1.html 程序通过css的滤镜不断改变字体四周发散出来的颜色的强度，使文字在视觉上具有不断闪烁的效果，好像燃烧一样。 文字特效 Math.sin( ) 内部函数，正弦函数 Math.abs( ) 内部函数，绝对值函数 parseInt( ) 内部函数，取整函数 div id=“div” align=“center”/div 设置区块对象 其中“div” 为区块名，与div.innerHTML=output 对应 innerHTML为显示属性（P212） substring(i , j) 取字符串中下标为i到j(不含j)之间的字符 文字特效 font style=font-size:72pt 设置字体大小的又一种方式 pt------磅 程序中的语句： font style=font-size:+size+pt 文字呈正弦函数式跳动 10.2 控件特效 (P213) 10.2.1 按钮特效 在网页设计中，按钮是一个可以做文章的地方，例如可以利用history对象来创建具有IE工具栏中“前进”和“后退”功能的自定义按钮、还可以设置按钮的形状、颜色等等。 例10.4是一个关于按钮特效的实例，它实现的过程并不复杂，但是运行效果非常实用，读者可以考虑在自己编写的程序中加以应用。 控件特效 表单对象都有.tagName属性，可判断是select类型还是input类型 .type属性可判断是button还是其它类型。 class 是input类的属性，一般用来引用某种样式 class=“initial” 引用一个名为initial的样式 event.srcElement 代表事件触发的元素(在此为按钮) 事件Mouseover 、Mouseout window.location 加载一个新文档 10.* 第十章 JavaScript应用与实践 10.1 文字特效 (P206) 10.1.1 文字移动 JavaScript能够在网页上实现各种特殊的文字效果，使信息不仅在内容上而且在形式上都同样地吸引人。 文字移动是最基本的文字特效，文字可以是前后移动或者是左右移动，同时可以设置文字移动的速度、移动文字的大小、颜色等等。 JavaScript中文字移动的效果是通过marquee标签来实现的，这也是网页中使用最广泛的一种动态效果。但是在Netscape浏览器中是不支持这个标签的。因此为了在所有的浏览器中都能够使文字移动的效果能够实现，必须在编写程序的时候事先考虑到这种情况，利用JavaScript来进行处理。 文字特效 文字移动 例10.1是一个文字移动效果的实例，代码见教材P207。 打开网页后，中间的文本就会由下向上缓慢移动，循环往复，就好像“跑马灯”一样。 marquee/marquee产生移动效果 例10.1中要考虑不同的浏览器，所以代码很长。 Ex10-1-1是一个简化的程序，默认只适合IE浏览器。 Ex10-1-2是一个不含JavaScript的程序，可与Ex10-1-1对照来看。 文字特效 marquee /marquee文字移动效果标签 direction=up 向上移动 direction= down 向下移动 direction= left 向左移动 direction= “right” 向右移动 color=#RRGGBB 六位十六进制数表示某一颜色 strong 表示加粗 big 表示大字 small 表示小字 p 表示段落（含换行） center表示居中 文字特效 marquee /marquee的属性 速度属性 scrollAmount=？ 宽度属性 width=？ 高度属性 height=？ 宽度属性和高度属性也可写成： style=“width:？; height:？” 文字特效 10.1.2 文字色彩 （P209） 网页设计中色彩的搭配是一门学问，最简单的文字色彩控制方法就是利用FONT标签的“color”属性来指定。但是利用JavaScript，可以给你的文字添加更加动态的色彩效果。 CSS滤镜是一个强大的工具，结合JavaScript进行时间上的一些控制，可以轻松实现各种独特的文字色彩效果。 CSS(样式表)的语句都放在STYLE标签中，例如GLOW滤镜，其标准定义语句为{filter:Glow(Color=color,Strength=n)}。 filter 表示滤镜