自由勇-王志勇(1980-09-26)
Webshu编辑。
1994年开始练习五笔字形；2000年底开始学习和大量实践网页制作；目前从事程序设计。

自由勇的Blog
Blog存档
我的Blog英文版
给我留言

访问统计：
38623

2004年01月15日 14:52　点击：超过8000次

　　昨天对Math.floor()的用法做了介绍，使用Math.floor()可以获得一个数的整数部分。在网页中呈现虚线的原理是，2个点的颜色交替，周而复始。根据这个原理，使用JavaScript写一段document.write单元格的循环程序。首先将程序列出来：

<script>len=400;d1=2;d2=2;cou=Math.floor(len/(d1+d2));
document.write('<table cellspacing=0 cellpadding=0 height=1 width='+len+'><tr>');
for(i=0;i<cou;i++){document.write('<td width='+d2+'><td width='+d1+' bgcolor=333333>')}</script></table>

　　运行的结果如：

　　说明：len=400表示虚线的长度为400像素，d1和d2是黑白相间的间隔，cou=Math.floor(len/(d1+d2))，cou表示总共要循环的次数。例如这里是400像素的虚线，黑色点和白色的点都是2像素，那么就要循环100次。由这200个单元格组成一条虚线。

改变虚线的长度，请修改len=400的值；
改变虚线的颜色，请修改bgcolor=333333的值；
改变虚线的高度，请修改height=1的值；
改变虚线的密度，请修改d1和d2的值。

例2：d1=6;d2=3

例3：d1=1;d2=1

例4：d1=3;d2=3;height=3;bgcolor=BBBBBB

例5：d1=3;d2=3;height=3;bgcolor=B1CD9D

例6：d1=4;d2=3;height=2;bgcolor=819DC5;width=500

例7：d1=2;d2=2;bgcolor=FF0000

　　也可以使用背景图片来制作虚线，出现的效果与上述的效果是一样的。

　　(版权所有，感谢阅读)

网页树树版权声明：
此文为Webshu.com独家撰稿，著作权属作者所有，禁止转载。
此文网址 http://www.webshu.com/column/102/55.html