这个音画的图片移动特效代码是移植了枳橘老师在网页特效介绍过的，移植过程肯定出了什么差错，这里面两张图片实际是同一张，其中有一张是复制后水平反转，按理说首位衔接天衣无缝，不知为什么会有跳转现象，是否因为原来的代码是三张图片，改成两张后不协调？，希望枳橘老师有空时帮我看一下。
另外我的音画做好发到知青网后，发现图片从窗口向右下偏移出来十多个像素，与窗口不吻合。我反复检查各个环节都没有问题，包括上传空间的都很正常，一发到网上就偏移，折腾好久找不出原因，最后只好用呆办法，将原图反方向出超十多个像素，才让他正好落入窗口。不知是不是与网站有冲突。
|
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>新建网页 5</title> </head> <body> <bgsound src="http://www.dabaoku.com/bjyinyue/mid/4.mid" loop="-1"> <table style="LEFT: 0px; WIDTH: 1000px; position: relative; TOP: 0px; HEIGHT:650px" background="http://yh.jisudns.com/userfiles/dengzc/shanghon.jpg"> <tr> <td> <div style="position: absolute; width: 569px; height: 337px; z-index: 1; left:190px; top: 148px"> <marquee onmouseover="this.stop()" style="border:1px solid #000000; LEFT: 1px; WIDTH: 569; CURSOR: hand; position: relative; TOP: 2px; HEIGHT:337" onmouseout="this.start()" scrollamount="2" scrolldelay="1" direction="right"> <div style="LEFT: 0px; WIDTH: 1831px; position: relative; TOP: 0px; HEIGHT:335px"> <table style="LEFT: -569px; WIDTH:3600px; position: absolute; TOP: 0px; HEIGHT: 335px" cellspacing="0" cellpadding="0" border="0"> <tr> <td style="WIDTH: 1200px" background="http://yh.jisudns.com/userfiles/dengzc/shangh.jpg"> </td> <td style="filter:flipH(); WIDTH: 1200px" background="http://yh.jisudns.com/userfiles/dengzc/shangh.jpg"> </td> <td style="WIDTH: 1200px" background="http://yh.jisudns.com/userfiles/dengzc/shangh.jpg"> </td> </tr> </table> </div> </marquee> <embed style="position: absolute; TOP: 146; LEFT: 118" height="360" type="application/x-shockwave-flash" width="496" src="http://www.fscyd.com/upFiles/tmsc/mnsc2/84.swf" wmode="transparent" quality="high"> <embed style="position: absolute; TOP: 29; LEFT: 16" height="98" type="application/x-shockwave-flash" width="127" src="http://www.zxtx.org/user/yiyi/html/flash/317.swf" wmode="transparent" quality="high"> </div> </td> </tr> </table> </body> </html> ++++++++++++++++++++++++++++++ 以上为制帖代码 ++++++++++++++++++++++++ ++++++++++++++++++++++++++++++++++++++++++ 以下为发帖代码 ++++++++++++ <br><br><br><br><br><br><br><br><br><br> <iframe style="position: relative; WIDTH: 1000px; height:650px; TOP: 0px; LEFT: -206px" marginheight="0" marginwidth="0" src="http://yh.jisudns.com/userfiles/dengzc/shqs.html" frameborder="0" width="1000" scrolling="no"> </iframe> |
谢谢桔橘老师这么快就帮我修改好了，我已改过。效果很好，平滑移动，毫无跳转，不折服不行。变动之处我再慢慢去琢磨。
|
兄台所提问题的讨论（相关代码详见楼上帖）。 １、对象定位的概念； ２、无js不间断滚动（字幕效果）。 这两个问题，在固顶的汇集帖中（第一部分）都有专文。请兄台再细细看看，以求吃透。 《对象定位讨论》 http://webftp.bbs.hnol.net/dysr/make/html_all/position.htm 《拆解“字幕特效不间断滚动”＿无js》 http://webftp.bbs.hnol.net/dysr/html-time/marquee-pic/marquee-pic.htm 在此，结合制作，再作一些讨论。也许，专文在表述上有些不到位。 一、定位问题 我将兄台制作的网页作了调整。 最外层为一表格对象，作为所有对象的容器（或叫参照物，专文中比喻为“箱子”），并将底图设置为它的背景图，这样较省事。它在网页中的定位没有位移。 第二层为div对象，相对于外层的表格为“绝对定位”，其中“放置”“字幕效果”和两个透明flash对象，都相对于它设置“定位”。这样，div又成了“字幕”和透明flash的“箱子”。 兄台所言发帖中的不听话，对象偏向“右下”方，是因为网页对象中，最外层的div设置了移位“left: 10px; top: 15px”（右移10px，下移15px），在以浮动框架“iframe”发帖时，网页中的对象在框架中的起始位置就已经不在“零”点了。而平常用“iframe”发帖时，设置“iframe”的定位，针对的情况不是这样的。 二、字幕效果 几个关键数据的来源： １、装载图片的表格对象的宽度为所有图片的总和，此例为1200×3=3600 。 ２、视窗（字幕效果的可见区域）的尺寸，此例宽度为569 。 ３、图片的容器div的宽度为：有效图片的宽度-视窗宽度，此例为2400-569=1831 。 “有效图片”是指制作中要求（或说计划）显示的图片内容，此例为一正一反的两张图片。 ４、整个图片对象（“装”在表格中）相对于“容器div”的位移，此例为-569，也就是视窗的宽度。 兄台制作中的不正常，是因为没有加上“需增加”的图片内容。原理可参考一下专文。建议在尝试中，将各对象的数据假设为凑整的数，以方便计算和思考。弄明白了后，无论怎样的情况都不会迷糊。 |
|
|
感谢桔橘老师临帖指导，虽然一时还稀里糊涂，我会对照置顶的专文，一步步来，应该可以弄懂吧。
衷心感谢！
| 欢迎光临 湖南知青网论坛2011年度 (http://2011.hnzqw.com/) | Powered by Discuz! 7.2 |