常用JS效果大全：美化网页体验

JS 效果大全 JS 效果是指使用 JavaScript 语言来实现的各种视觉效果，用于增强网页的交互性和美观性。以下是 200 多种常用的 JS 效果的总结： 一、输入框效果 1.onBlur 和 onFocus 事件：当用户离开或聚焦输入框时，触发相应的事件。例如，使用 onBlur 事件来清空输入框的值，使用 onFocus 事件来设置输入框的默认值。 代码示例：<input type="text" value="mm" onfocus="if(value=='mm'){value=''}" onblur="if(value==''){value='mm'}"> 2.按钮样式效果：使用 CSS 样式来美化按钮的外观，例如，改变按钮的背景颜色、边框样式、字体颜色等。 代码示例：<input type="button" name="Submit1" value="ǿ" size=10 class="s02" style="background-color:rgb(235,207,22)"> 二、提交按钮效果 3.onMouseOut 和 onMouseOver 事件：当用户鼠标离开或悬停在提交按钮上时，触发相应的事件。例如，使用 onMouseOut 事件来改变按钮的颜色，使用 onMouseOver 事件来恢复按钮的原始颜色。 代码示例：<input type="submit" value="Ұ" name="B1" onMouseOut="this.style.color='blue'" onMouseOver="this.style.color='red'"> 4.提交按钮样式效果：使用 CSS 样式来美化提交按钮的外观，例如，改变按钮的背景颜色、边框样式、字体颜色等。 代码示例：<input type="submit" value="submit" style="border:1px solid:#666666;height:17px;width:25pt;font-size:9pt;BACKGROUND-COLOR:#E8E8FF;color:#666666" name="submit"> 三、文本框效果 5.文本框样式效果：使用 CSS 样式来美化文本框的外观，例如，改变文本框的边框样式、字体颜色、背景颜色等。 代码示例：<input type="text" name="nick" style="border:1px solid #666666;font-size:9pt;height:17px;BACKGROUND-COLOR:#F4F4FF;color:#ff6600" size="15" maxlength="16"> 6.文本框宽高效果：使用 HTML width 和 height 属性来设置文本框的宽高。 代码示例：<input type="text" name="T1" size="20" style="border-style:solid;border-width:1"> 四、窗口效果 7.窗口resize效果：使用 JavaScript 语言来设置窗口的大小。 代码示例：<script>window.resizeTo(300,283);</script> 五、滚动效果 8.滚动文字效果：使用 HTML marquee 元素来创建滚动文字效果。 代码示例：<marquee direction="up" scrollamount="1" scrolldelay="100" onmouseover='this.stop()' onmouseout='this.start()' height="60"> <!--head_scrolltext--> ... <!--endhead_scrolltext--> 这些 JS 效果可以帮助开发者创造出更加美观、交互性强的网页，提高用户体验。但是，需要注意的是，过多使用 JS 效果可能会影响网页的加载速度和可读性，因此需要合理地使用这些效果。