dreamweaver中如何让左右滚动的图片首尾相接
<marquee><imgsrc="images/1__.jpg"width="200";height="150"/><imgsrc="images/1-.jpg"wid...
<marquee ><img src="images/1__.jpg" width="200"; height="150" /><img src="images/1-.jpg" width="200"; height="150" /><img src="images/1...jpg" width="200"; height="150"/><img src="images/7.jpg" width="200"; height="150" /><img src="images/3.gif" width="200"; height="150"/><img src="images/5.gif" width="200"; height="150"></marquee>
展开
6个回答
展开全部
直接把代码粘贴到DW即可,原理很简单,不明白的地方再问我好了
无缝滚动
#container1 td,#container2 td { border:1px #CCC solid; padding:4px; }
#wrap { width:600px; overflow:hidden; background:#EBEBEB; padding:10px; }
" />
" />
" />
" />
" />
" /> var wrap = document.getElementById("wrap"); var container1 = document.getElementById("container1"); var container2 = document.getElementById("container2"); container2.innerHTML = container1.innerHTML; function marquee() { if(container2.offsetWidth-wrap.scrollLeft wrap.scrollLeft-=container1.offsetWidth; } else{ wrap.scrollLeft++; } } var interval=setInterval(marquee,10); wrap.onmouseover=function() {clearInterval(interval)} wrap.onmouseout=function() {interval = setInterval(marquee,10)}
" />
" />
" />
" />
" />
" /> var wrap = document.getElementById("wrap"); var container1 = document.getElementById("container1"); var container2 = document.getElementById("container2"); container2.innerHTML = container1.innerHTML; function marquee() { if(container2.offsetWidth-wrap.scrollLeft wrap.scrollLeft-=container1.offsetWidth; } else{ wrap.scrollLeft++; } } var interval=setInterval(marquee,10); wrap.onmouseover=function() {clearInterval(interval)} wrap.onmouseout=function() {interval = setInterval(marquee,10)}
博思aippt
2024-07-20 广告
2024-07-20 广告
作为深圳市博思云创科技有限公司的工作人员,对于Word文档生成PPT的操作,我们有以下建议:1. 使用另存为功能:在Word中编辑完文档后,点击文件->另存为,选择PowerPoint演示文稿(*.pptx)格式,即可将文档内容转换为PPT...
点击进入详情页
本回答由博思aippt提供
展开全部
使用js无缝滚动可以做到,下面是样例 横竖都有
<style type="text/css">
#a{width:500px; height:400px; border:#000000 solid 5px; overflow:hidden; float:left;}
#a1{width:2000px; height:400px; background-color:#999999;}
#b{width:500px; height:400px; border:#000000 solid 5px; overflow:hidden; float:left;}
#b1{width:500px; height:1600px; background-color:#999999;}
#a1 img{width:500px; height:400px;}
#b1 img{width:500px; height:400px;}
</style>
</head>
<body>
<div id="a">
<div id="a1">
<img src="1.jpg" align="left">
<img src="3.png" align="left">
<img src="2.jpg" align="left">
<img src="4.jpg" align="left">
</div>
</div>
<div id="b">
<div id="b1">
<img src="5.jpg" align="top">
<img src="6.jpg" align="top">
<img src="7.jpg" align="top">
<img src="8.jpg" align="top">
</div>
</div>
<script type="text/javascript">
a=document.getElementById("a");
b=document.getElementById("b");
i=0;
f=0;
function aa(){
a.scrollLeft=i;
i+=1;
if(i==2001){
i=0
}
}
function bb(){
b.scrollTop=f;
f+=1;
if(f==1601){
f=0
}
}
setInterval("aa()",1);
setInterval("bb()",1);
</script>
</body>
<style type="text/css">
#a{width:500px; height:400px; border:#000000 solid 5px; overflow:hidden; float:left;}
#a1{width:2000px; height:400px; background-color:#999999;}
#b{width:500px; height:400px; border:#000000 solid 5px; overflow:hidden; float:left;}
#b1{width:500px; height:1600px; background-color:#999999;}
#a1 img{width:500px; height:400px;}
#b1 img{width:500px; height:400px;}
</style>
</head>
<body>
<div id="a">
<div id="a1">
<img src="1.jpg" align="left">
<img src="3.png" align="left">
<img src="2.jpg" align="left">
<img src="4.jpg" align="left">
</div>
</div>
<div id="b">
<div id="b1">
<img src="5.jpg" align="top">
<img src="6.jpg" align="top">
<img src="7.jpg" align="top">
<img src="8.jpg" align="top">
</div>
</div>
<script type="text/javascript">
a=document.getElementById("a");
b=document.getElementById("b");
i=0;
f=0;
function aa(){
a.scrollLeft=i;
i+=1;
if(i==2001){
i=0
}
}
function bb(){
b.scrollTop=f;
f+=1;
if(f==1601){
f=0
}
}
setInterval("aa()",1);
setInterval("bb()",1);
</script>
</body>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
滚动图片用你的这个方法肯定是不能首尾相接的,给你一段通用代码吧,这段代码需要 images目录下有 7 张GIF图片,分别为 01.gif 02.gif ...07.gif
当然,你也可以根据自己需要更改。
<div id="pp0" style="width:890px;overflow:hidden;height:150px">
<table border="0" cellspacing="0" cellpadding="0" width="2100px">
<tr>
<td id="pp1">
<%
for t=1 to 7
%>
<img src="images/0<%=t%>.gif" height="150px" width="200px" />
<%
next
%>
</td>
<td id="pp2"></td>
</tr>
</table>
</div>
<script language="javascript">
<!--
var pp0=document.getElementById("pp0");
var pp1=document.getElementById("pp1");
var pp2=document.getElementById("pp2");
pp2.innerHTML=pp1.innerHTML;
function scrollpict(){
if (pp0.scrollLeft>=pp2.offsetWidth)
{
pp0.scrollLeft=pp0.offsetWidth-pp0.scrollLeft;
}
else
{
pp0.scrollLeft++;
}
}
var ret1=setInterval("scrollpict()",1);
//-->
</script>
当然,你也可以根据自己需要更改。
<div id="pp0" style="width:890px;overflow:hidden;height:150px">
<table border="0" cellspacing="0" cellpadding="0" width="2100px">
<tr>
<td id="pp1">
<%
for t=1 to 7
%>
<img src="images/0<%=t%>.gif" height="150px" width="200px" />
<%
next
%>
</td>
<td id="pp2"></td>
</tr>
</table>
</div>
<script language="javascript">
<!--
var pp0=document.getElementById("pp0");
var pp1=document.getElementById("pp1");
var pp2=document.getElementById("pp2");
pp2.innerHTML=pp1.innerHTML;
function scrollpict(){
if (pp0.scrollLeft>=pp2.offsetWidth)
{
pp0.scrollLeft=pp0.offsetWidth-pp0.scrollLeft;
}
else
{
pp0.scrollLeft++;
}
}
var ret1=setInterval("scrollpict()",1);
//-->
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
2010-12-09
展开全部
你说的效果是无缝滚动
这里有一个无缝滚动效果
你把文字换图片就行
这里有一个无缝滚动效果
你把文字换图片就行
参考资料: http://www.blueidea.com/common/shoutbox/redir.asp?4=i&id=12229
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
这是我用的代码,可以看看,是要用JS控制的,呆呆的滚动代码不能实现首尾相接的
http://hi.baidu.com/aiyayaztt/blog/item/fe64cc1fb4f5786df724e449.html
http://hi.baidu.com/aiyayaztt/blog/item/fe64cc1fb4f5786df724e449.html
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询
广告 您可能关注的内容 |