第二十三节 移动标签的应用(16) 图片的移动(6) 本节继续学习图片的移动。下面讲解图片的两种移动代码。要深刻领会标签中的内容,学会应用这些移动标签。 一、多图片分割移动图代码: <table border="5" cellSpacing="5" cellPadding="3" width="650" height="210"> <tbody> <tr> <td align="center"> <marquee width="120" scrollAmount="2" scrollDelay="100"><img title="春天没来欢迎您" alt="春天没来欢迎您" src="http://image52.360doc.com/DownloadImg/2012/06/1315/24828273_2" height="210" real_src="http://image52.360doc.com/DownloadImg/2012/06/1315/24828273_2"></marquee></td> <td align="center"> <marquee width="120" scrollAmount="2" scrollDelay="100"><img title="春天没来欢迎您" alt="春天没来欢迎您" src="http://image52.360doc.com/DownloadImg/2012/06/1315/24828273_3" height="210" real_src="http://image52.360doc.com/DownloadImg/2012/06/1315/24828273_3"></marquee></td> <td align="center"> <marquee width="120" scrollAmount="2" scrollDelay="100"><img title="春天没来欢迎您" alt="春天没来欢迎您" src="http://image52.360doc.com/DownloadImg/2012/06/1315/24828273_4" height="210" real_src="http://image52.360doc.com/DownloadImg/2012/06/1315/24828273_4"></marquee></td> <td align="center"> <marquee width="120" scrollAmount="2" scrollDelay="100"><img title="春天没来欢迎您" alt="春天没来欢迎您" src="http://image52.360doc.com/DownloadImg/2012/06/1315/24828273_5" height="210" real_src="http://image52.360doc.com/DownloadImg/2012/06/1315/24828273_5"></marquee></td> <td align="center"> <marquee width="120" scrollAmount="2" scrollDelay="100"><img title="春天没来欢迎您" alt="春天没来欢迎您" src="http://image52.360doc.com/DownloadImg/2012/06/1315/24828273_6" height="210" real_src=" http://image52.360doc.com/DownloadImg/2012/06/1315/24828273_6"></marquee></td></tr></tbody></table> <p> <wbr></p> “多图片分割移动图”代码设置要点: 1、表格标签中必须设置表格的间距数值。例如:cellSpacing="5" 2、每个图片独占一个单元格,并由一个移动标签控制。 3、控制每个图片的移动标签最好都相同。 二、图中图 移动图代码: <table style="width: 950px; height: 617px;" border="5" cellSpacing="0" borderColor="#990030" cellPadding="2" background="http://image27.360doc.com/DownloadImg/2011/04/2502/11198791_3.jpg" align="center"> <tbody> <tr> <td> <marquee style="width: 790px; height: 500px;" direction="up" behavior="alternate" scrollAmount="5"> <marquee height="317" behavior="alternate" width="790" scrollAmount="5"> <img style="filter: alpha(opacity=100,style=2);" id="image_operate_27401302678376890" src="http://image32.360doc.com/DownloadImg/2011/07/1211/14116499_6" width="250"></marquee> </marquee></td></tr></tbody></table> “图中图 移动图”代码设置要点: 1、设置一个表格,表格中放入一个背景图片,单元格中放入一个图片。 2、背景图片最好是规格大一些的风景图片; 3、第一个移动标签,移动方向“向上”,移动方式“来回走”; 4、第二个移动标签,移动方向“向左”,移动方式“来回走”。第二个移动标签的“移动屏幕宽度”可以和第一个移动标签的移动屏幕宽度相同,移动高度,必须小于第一个移动标签的移动屏幕高度。 5、两个移动标签中的移动速度最好相同。 6、表格个规格要比移动屏幕个规格大一些。 作业: 应用上面的两种移动代码,各制作一篇文章。 |
|