js图片轮播的难题，要求不用jQuery等框架，因为太大用在手机上，图片的css样式中不要浮动，因为浮动起来横向排列把浏览器撑得很大（某些BW），大神请指导！！
 |
躺尸三百首
2014-01-03
<!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> <title> 代码这样写就是硬生生的换图片请问能加上过渡效果不？感激不尽</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript"> var numb = 0; var imgnumb = 1; function imgfor() { imgnumb++; document.getElementById('img1').setAttribute('src','picture/' + imgnumb + '.jpg'); if (imgnumb == 9) { imgnumb = 0; } } var clearid; function clearfun() { window.clearInterval(clearid); } clearid = setInterval(imgfor, 2000); </script> <style type=""> #img1{ </style> </head> <body> <img alt="这是一张图" id="img1" class="style1" src="picture/1.jpg" width="500px" height="500px" /> <br /> <input type="button" value="多张图片轮换" onclick="imgfor();" /> <br /> <input type="button" value="结束执行" onclick="clearfun();" /> </body> </html> |
|
躺尸三百首
2014-01-03
大家不要让我写到的代码引导了，请指导小鸟
|
 |
xiaojianbo
2014-01-12
实现起来不难，可以不用jquery，我用原生JS写的，我的思路是：
页面 <div id="imgs-1"> </div> ... <div id="imgs-n"> </div> 你用JS去写个循环，从imgs-1开始轮换，轮换到imgs-n,到最后时把轮换的值改为1 for(var i=i;n>1;i++) { ... } 可以看看http://www.mn97.com里面的效果，图片轮换 |
