注意: 各参数详解:
(1)scrollAmount。它表示速度,值越大速度越快。如果没有它,默认为6,建议设为1~3比较好。
(2)width和height,表示滚动区域的大小,width是宽度,height是高度。特别是在做垂直滚动的时候,一定要设height的值。
(3)direction。表示滚动的方向,默认为从右向左:←←←。可选的值有right、down、up。滚动方向分别为:right表示→→→,up表示↑,down表示↓。
(4)scrollDelay,这也是用来控制速度的,默认为90,值越大,速度越慢。通常scrollDelay 是不需要设置的。
(5)behavior。用它来控制属性,默认为循环滚动,可选的值有alternate(交替滚动)、slide(幻灯片效果,指的是滚动一次,然后停止滚动)
(6)蓝色地方是图片地址,可以换上自己喜欢的图片。
向上循环
效果:
2.图片向下循环滚动代码:
3.图片向左循环滚动代码:
4.图片向右循环滚动代码:
效果:
5.图片来回滚动代码:
以上五种图片滚动效果代码说明:
1.“width=380”表示滚动的宽度范围,数值可以按自己喜欢的调整
2.“height=275”表示滚动的高度范围,数值可以随意调整
3.“scrollAmount=3”表示滚度速度为3,1到3为最佳数值,默认为6
4.“height=275”表示图片的高度为275
(建议按自己喜欢的图片高度调整)
5.“width=220”表示图片的宽度为220
(建议按自己喜欢的图片宽度调整)
6.“图片地址”表示图片的属性地址粘贴处
(因本人太懒,所以所有的滚动图片都只用一张代替;(*^__^*),当然,
每个“图片地址”都可以换上不同的图片地址,效果会更好。)
下面我们说说图片的添加:
首先:
表示一张图片的粘贴代码,如果要增加或减少一个图片,则是添加或删除一段这个代码就ok了。
那么:如何添加?
其实只要把这段代码放在相同的代码后面或前面就可以了。
6.图片居中向两边滚动代码:
7.图片居中上下分开滚动代码:
8.图片居中上下靠拢滚动代码:
效果:
以上6、7、8双向滚动代码说明:
1.绿色地方“width=220 height=200”表示滚动范围的宽和高度,
尤其宽度绝对要参对图片的宽度来调整。
2.为什么要区分图片地址的1和2,这是因为要说明如果做好这个对图效果,
则需要所有的图片地址1都放相同图片,图片地址2也是要对齐2的图片,
如果要添加图片,则需要上下图片对应添加。
比如:添加图片地址3后代码显示:
9.图片设定百叶窗式对开滚动代码:
代码说明:
1.“borderColor=#FF00CC”表示边框颜色,颜色码:FF00CC
去掉“borderColor=#FF00CC”表示默认为白色
2.“width=110”表示图片滚动范围的宽度、最好调整为1张图片宽度的一半。
3.“cellSpacing=2”表示表格线的距离为2,本人认为最佳值为1到3。
4.“border=2”表示边框外格线的宽度为2、可以调整。
HTML网页特效CSS大全 css属性代码大全 一CSS文字属性: color : #999999; /*文字颜色*/ font-family : 宋体,sans-serif; /*文字字体*/ font-size : 9pt; /*文字大小*/ font-style:itelic; /*文字斜体*/ font-variant:small-caps; /*小字体*/ letter-spacing : 1pt; /*字间距离*/ line-height : 200%; /*设置行高*/ font-weight:bold; /*文字粗体*/ vertical-align:sub; /*下标字*/ vertical-align:super; /*上标字*/ text-decoration:line-through; /*加删除线*/ text-decoration: overline; /*加顶线*/ text-decoration:underline; /*加下划线*/ text-decoration:none; /*删除链接下划线*/ text-transform : capitalize; /*首字大写*/ text-transform : uppercase; /*英文大写*/ text-transform : lowercase; /*英文小写*/ text-align:right; /*文字右对齐*/ text-align:left; /*文字左对齐*/ text-align:center; /*文字居中对齐*/ text-align:justify; /*文字分散对齐*/ vertical-align属性 vertical-align:top; /*垂直向上对齐*/ vertical-align:bottom; /*垂直向下对齐*/ vertical-align:middle; /*垂直居中对齐*/ vertical-align:text-top; /*文字垂直向上对齐*/ vertical-align:text-bottom; /*文字垂直向下对齐*/ 二、CSS边框空白 padding-top:10px; /*上边框留空白*/ padding-right:10px; /*右边框留空白*/ padding-bottom:10px; /*下边框留空白*/ padding-left:10px; /*左边框留空白 三、CSS符号属性: list-style-type:none; /*不编号*/ list-style-type:decimal; /*阿拉伯数字*/ list-style-type:lower-roman; /*小写罗马数字*/ list-style-type:upper-roman; /*大写罗马数字*/ list-style-type:lower-alpha; /*小写英文字母*/ list-style-type:upper-alpha; /*大写英文字母*/
js脚本结束 4。简单的页面加密
网页制作特效——网页特效 (1)导航菜单:
Javascript特效代码大全(420个) Javascript 特效代码 ├Cookie脚本├随访问次数变提示├集成Cookies ├使窗口仅弹出一次├签名提示程序├记录上次登录时间├自由控制打开窗口├记录页面修改时间├检测IE去过站点├离开时显示信息├弹出窗口自动关闭├离开页面弹出窗口├进入时显示信息├离开启动收藏夹├链接确认按钮├点击加入收藏夹├记录页面更新时间├页面载入等待├打开硬盘驱动器├设置默认首页├输入框测试警告├链接弹出警告框├关闭窗口链接├显示器分辨率检测├按分辨率导航├定制打开的窗口├控制窗口打开日期├打开窗口居中├输入框控制├查看输入框内容├显示所有链接├限时载入页面├输入框神秘消失├检测访问来源├回退的页面数├危险的链接├倒计时载入页面├自由打开窗口├检测IE所装插件├检测点链接速度├检测健康程度?├页面中打开窗口├特殊的Bookmark ├窗口打开关闭程序├随机显示一些数字├页面自动打开├进入弹出收藏夹├自动显示是否更新├浏览器详
细报告 ├ 页面背景类├背景向下移动├背景不停变换色彩├使页面产生百叶窗├颜色代码英文集├自已选择背景颜色├背景颜色安全测试├颜色选择器├背景图片居中├页面转换特效├礼花背景├链接驱动背景色├手动调节背景色├鼠标使链接变色├跟随鼠标旋转背景├背景调色板├RGB颜色转换 ├按钮驱动背景├颜色选择器├精彩的变色文字├颜色选择器├闪烁的霓虹灯├星星从背景中飞出├背景向下移动(二) ├动态选择背景色├下雨├按钮驱动背景变化├按钮使背景闪烁├背景随机显示├背景快速闪烁├自己选择背景图片 ├ 文本特效类├随机信息显示├随机文本链接├所有链接不停变色├鼠标经过文字变色├随日期变换文本├文字颜色渐变脚本├文本自动输出├文字特效├文字不停变色├字符连续消隐├公告栏
自动切换的图片幻灯切换效果(图片滚动新闻) 可自己修改滚动图片和增加滚动图片数量,以及修改滚动图片大小等! 1.效果预览: 2.代码部分:(将一下代码复制粘贴到记事本中,把后缀改成.html)
A | B | C | D | E | F | G |