用css3实现循环滚动效果：
css：
#wrap{
width: 200px;
height: 150px;
border: 1px solid #000;
position: relative;
margin: 100px auto;
overflow: hidden;
}
#list{
position: absolute;
left: 0;
top: 0;
margin: 0;
padding: 0;
animation: move 12s infinite linear;
-webkit-animation: move 12s infinite linear;
width: 500%;
}
#list li {
list-style: none;
width: 200px;
height: 150px;
border: 0;
float: left;
}
@-webkit-keyframes move{
0% {
left: 0;
}
100% {
left: -800px;
}
}
@keyframes move {
0% {
left: 0;
}
100% {
left: -800px;
}
}
#wrap:hover #list {
-webkit-animation-play-state: paused; /*动画暂停播放*/
}
html：
<div id="wrap">
<ul id="list">
<li><a href="#"><img src="img/1.jpg" border="0" /></a></li>
<li><a href="#"><img src="img/2.jpg" border="0" /></a></li>
<li><a href="#"><img src="img/3.jpg" border="0" /></a></li>
<li><a href="#"><img src="img/4.jpg" border="0" /></a></li>
<li><a href="#"><img src="img/5.jpg" border="0" /></a></li>
</ul>
</div>
扩展资料：
animation（动画） 属性：
语法：
animation: name duration timing-function delay iteration-count direction fill-mode play-state;
参数：
1、animation-name：指定要绑定到选择器的关键帧的名称。
2、animation-duration：动画指定需要多少秒或毫秒完成。
3、animation-timing-function：设置动画将如何完成一个周期。
值：
linear：动画从头到尾的速度是相同的。
ease：默认。动画以低速开始，然后加快，在结束前变慢。
ease-in：动画以低速开始。
ease-out：动画以低速结束。
ease-in-out：动画以低速开始和结束。
cubic-bezier(n,n,n,n)：在 cubic-bezier 函数中自己的值。可能的值是从 0 到 1 的数值。
4、animation-delay：设置动画在启动前的延迟间隔。
5、animation-iteration-count ：定义动画的播放次数。
值：
n：一个数字，定义应该播放多少次动画。
infinite：指定动画应该播放无限次（永远） 。
向左或向右都可以，无缝隙循环滚动，麻烦请给完整代码，5张图片图片大小200*150，最
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>test</title>
<style>
.picutre_many img{width:200px; height:150px;}
</style>
</head>
<body>
<div id="list" class=" picutre_many"
style="overflow: hidden; height: 150px; width: 800px; margin: 0 auto;">
<table cellspacing="0" cellpadding="0"
style="width: 680px; border: 0px;">
<tr>
<td id="list1">
<table style="border: 0px;" cellpadding="0" cellspacing="0">
<tr id="pic">
<td><img style="border: 0px;" alt="" src="1.jpg" /></td>
<td><img style="border: 0px;" alt="" src="2.jpg" /></td>
<td><img style="border: 0px;" alt="" src="3.jpg" /></td>
<td><img style="border: 0px;" alt="" src="4.jpg" /></td>
<td><img style="border: 0px;" alt="" src="5.jpg" /></td>
</tr>
</table>
</td>
<td id="list2"></td>
</tr>
</table>
</div>
<script type="text/javascript">
/*图片滚动效果*/
var speedpic = 20;//速度数值越大速度越慢
document.getElementById("list2").innerHTML = document.getElementById("list1").innerHTML;
function Marqueepic() {
if (document.getElementById("list2").offsetWidth
- document.getElementById("list").scrollLeft <= 0) {
document.getElementById("list").scrollLeft -= document
.getElementById("list1").offsetWidth;
} else {
document.getElementById("list").scrollLeft++;
}
}
var MyMarpic = setInterval(Marqueepic, speedpic);
document.getElementById("list").onmouseover = function() {
clearInterval(MyMarpic);
}
document.getElementById("list").onmouseout = function() {
MyMarpic = setInterval(Marqueepic, speedpic);
}
</script>
</body>
</html>
把图片的src改一下，应该没问题。如果可以的话，40金币拿来吧，哈哈本回答被提问者采纳
那你要多少分
追答首先,你的问题描述我看不懂,其次,你的分低,技术类的东西,一般不是正在做这个的,谁没事帮你做??
报酬起码100吧
html图片向左无缝隙循环滚动代码
用css3实现循环滚动效果：css：wrap{ width: 200px;height: 150px;border: 1px solid #000;position: relative;margin: 100px auto;overflow: hidden;} list{ position: absolute;left: 0;top: 0;margin: 0;padding: 0;animation: move 12s infinite linear;-webkit-animation: move 12s infinite...
图片不间断循环滚动代码(向左,向右,向上,向下)
\/\/向左} } var MyMar=setInterval(Marquee,speed)demo.onmouseover=function(){clearInterval(MyMar)} demo.onmouseout=function(){MyMar=setInterval(Marquee,speed)} <\/script>\/\/向右滚动，其实代码差不多，就一个地方不一样<script> var speed=30 demo2.innerHTML=demo1.innerHTML demo.scrollLef...
html中如何让图片自动切换?
首先打开软件，并创建一个新的html文件。创建新文件后，设置页面背景颜色。在新文件中创建段落一，或者选择一个段落。再引入图片并设置图片大小，这里就可以设置图片浮动至段落的左边。可以使用JavaScript来添加点击左右箭头来切换图片的功能。你可以为每个箭头添加一个onclick事件，然后使用JavaScript代码来设置...
图片首尾相接左右循环滚动代码
<marquee behavior=alternate vspace="滚动区距上边框距离" hspace="滚动区距左边框距离" width="滚动区长度" heiget="60" onmouseout=this.start() onmouseover=this.stop()> <table border=1 bordercolor=red> <tr> <td> <img src="图片路径"> ...<\/td> <\/tr> <\/table> <\/marquee>...
图片从右向左无间隙滚动代码
--多个图片从这开始循环---><td width="180" align="center" style="border-right: dashed 1px #EFEFEF;"><table width="180" border="0" cellspacing="0" cellpadding="0"><tr><td height="110" align="center"><img src="" width="120" height="90" border="0" alt="" \/><\/...
html怎样使滚动字幕无缝隙循环
html图片循环滚动无缝隙代码：<!DOCTYPE html PUBLIC "-\/\/W3C\/\/DTD XHTML 1.0 Transitional\/\/EN"<html xmlns="<head> <meta http-equiv="Content-Type" content="text\/html; charset=gb2312" \/> <title>无标题文档<\/title> <style type="text\/css"> \/*gundongtupian*\/ demo0 { width:712...
html怎么设置图片滚动播放
<DIV id=demo style="overflow: hidden; width: 600px; height: 190px; top:485px; left:252px;position: absolute;"> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td valign="top" id=demo1> <!-- 循环滚动的图片 --> <table width="600" border="0" align="...
急求html代码,当鼠标移动到图片,图片停此滚动?
<!--下面是向左滚动代码--> <div id="butong_net_left" style="overflow:hidden;width:500px;"> <table cellpadding="0" cellspacing="0" border="0"> <tr><td id="butong_net_left1" valign="top" align="center"> <table cellpadding="2" cellspacing="0" border="0"> <tr align...
谁会html代码,我想让几张相片来回滚动显示怎么办???
1)代码如下:这是让图片上下滚动的代码 <marquee behavior="alternate(上下滚动)[scroll" scrollamount(速度)="2" loop(这是显示循环次数[-1代表无限])="-1"direction="down(这表示图片从上往下开始)" width(容器的宽度)="60"height(容器的长度)="60"><img src=""><\/marquee> 2)让图片左右...
html图片无缝滚动代码怎么写?
DOCTYPE html PUBLIC "-\/\/W3C\/\/DTD XHTML 1.0 Transitional\/\/EN" "http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-transitional.dtd"><HTML xmlns="http:\/\/www.w3.org\/1999\/xhtml"><HEAD><meta charset="utf-8" \/><TITLE>分别用marquee和div+js实现首尾相连循环滚动效果<\/TITLE><\/HEAD><...
