html里30张多图片轮播代码
h5代码：
10987654321
css代码：
@-webkit-keyframes move{0%{left:-500px;}100%{left:0;}}#wrap{width:600px;height:130px;border:1px solid #000;position:relative;margin:100px auto;overflow: hidden;}#list{position:absolute;left:0;top:0;padding:0;margin:0;-webkit-animation:5s move infinite linear;width:200%;}#list li{list-style:none;width:120px;height:130px;border:1px solid red;background: pink;color:#fff;text-align: center;float:left;font:normal 50px/2.5em '微软雅黑';}#wrap:hover #list{-webkit-animation-play-state:paused;}
扩展资料：
轮播图就是一种网站在介绍自己的主打产品或重要信息的传播方式。说的简单点就是将承载着重要信息的几张图片，在网页的某一部位进行轮流的呈现，从而做到让浏览者很快的了解到网站想要表达的主要信息。以及各种新闻网站的头版头条都是用这种方式呈现的重要信息。
轮播图的实现方式：例如：有5张轮播的图片，每张图片的宽度为1024px、高度为512px.那么轮播的窗口大小就应该为一张图片的尺寸，即为：1024×512。之后将这5张图片0px水平相接组成一张宽度为：5120px,高度依然为：512px。最后将这张合成后的大图每次向左移动1024px即可实现轮播图。
使用DIV,CSS样式来做！
一般现在使用3P来实现，如APS.NET！
你可以拷贝一个脚本修改里面的参数，就可以达到效果了！
使用html代码，只能使用一个！
就是跑马灯标签来实现简单的效果！
这个标签！
如：
这是一段 跑动 的文字.我经过它就能停下来.
其中的scrollamount属性可以改变速度.值小它就会变慢.
height可以改变高度.direction可以改变方向.direction=up就会向上动
我建议你去找一ASP,或者JavaScript的代码来进行修改参数！
有12345数字一起切换
鼠标点一下数字会变换到另一张图片，不点就会自动换
里面有教程和源码
<html>
<head>
<title>图片滚动 </title>
<style>
#div1 {position:relative;width:650px;height:210px;overflow:hidden; }
#div2{position:absolute;}
li{float:left;list-style-type:none;padding:5px;}
img{border:none;}
a{position:relative;}
</style>
<script>
window.onload=function()
{
var odiv2=document.getElementById('div2');
var ali=odiv2.getElementsByTagName('li');
var aspeed=-5;
odiv2.innerHTML+=odiv2.innerHTML;
odiv2.style.width=ali[0].offsetWidth*ali.length+'px';
setInterval(function()
{
odiv2.style.left=odiv2.offsetLeft+aspeed+'px';
if (odiv2.offsetLeft<-odiv2.offsetWidth/2)
{
odiv2.style.left='0px';
}
},30);};
}
</script>
</head>
<body>
<div id='div1'>
<div id='div2'>
<li><a href=""><img src="1.jpg" /></a></li>
<li><a href=""><img src="2.jpg" /></a></li>
<li><a href=""><img src="3.jpg" /></a></li>
<li><a href=""><img src="4.jpg" /></a></li>
<!--这边你可以添加任意多的li，也就是你可以添加任意多的图片，使任意多的图片轮播-->
</div>
</div>
</body>
</html>
网上搜一下一堆源码
中叔魏归脾： 1、首先我们创建一个简单的项目,如图所示包括html,css和img三个. 2、这里是html文件,引入css和html代码文件,如图所示. 3、这里是css文件代码,上面是div和图片显示的效果代码,后面是动画效果. 4、这里是事件,这里定义了四个时间段的状态,兼容了ie的. 5、如图所示这里是效果图,会根据时间轮播显示下一张图片 了.
米林县19698077038： html怎么实现多图全屏图片循环滚动？
中叔魏归脾： 这个要用javascript实现,可以在网上找找js全屏滚动代码
米林县19698077038： 简单的HTML+js图片轮播? - ？
中叔魏归脾： h5代码:<div id=“wrap”><ul id=“list”><li>10</li><li>9</li><li>8</li><li>7</li><li>6</li><li>5</li><li>4</li><li>3</li><li>2</li><li>1</ul></div> css代码:<style type=＂text/css＂>@-webkit-keyframes move{0%{left:-500px;}100%{left:0;}}#wrap{width:...
米林县19698077038： 图片轮播能用HTML实现呢,只用HTML不加入js脚本,求大神赐教,有的话给发下代码？
中叔魏归脾： <MARQUEE><img src=＂你的图片地址＂ /></MARQUEE> 这算是纯HTML的轮播了吧.
米林县19698077038： 网页:求多张图片无限轮播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 http-equiv=＂Content-Type＂ content=＂text/...
米林县19698077038： 在HTML中怎样全屏轮播图,让图随着窗口的大小自动调整 - ？
中叔魏归脾： onresize事件绑定一个方法,对图片的大小,轮播窗口的布局和轮播的各参数做相应调整
米林县19698077038： 怎么用html代码设置图片轮播效果,我在网上搜了很多,但都没办法实现,哪位高手可以告诉我啊 - ？
中叔魏归脾： 简单地说,光用HTML是实现不了图片轮播效果的. 多半要用到javascript脚本了. 不过这个效果应该是比较好实现,如果你搜到的不行的话,你可以再HI我,也许可以给你写一个,如果有时间的话.
米林县19698077038： HTML轮播图怎么做 用JS做个简单的轮播图 越简单越好 - ？
中叔魏归脾： obj1.onmouseover = function () {clearInterval(time);}obj1.onmouseout = function () {time = setInterval(＂turn();＂, 6000);}for (var num = 0; num < obj2.length; num++) {obj2[num].onmouseover = function () {turn(this.innerHTML);...
米林县19698077038： 一个html页面如何放置多个相同类型的图片轮播,用javascript实现,求大神,最好附实例代码,谢啦 - ？
中叔魏归脾： http://sc.chinaz.com/jiaoben/130419344800.htm#down 自己下载,免费开源的
米林县19698077038： 找高手,求一个html代码,如下图,中间空白处可以放轮播的! - ？
中叔魏归脾： 比如说你中间那个位置有一个 在img上加onclick事件,在事件函数里面改变img的路径.如果是自己轮流放,你可以在网上搜索一下:js 实现图片滚动效果 一看就明白.
