[新手求助]做了一个简单的图像滚动条,只在IE下好用。。。
做了一个如图所示的简单图像滚动条,就是按左右箭头可以翻下一张和前一张用了JQuery在IE上和开发用的DW上都可用,但在Chrome和Opera上运行则无法翻阅,与其说无法翻阅更是翻一下就跳回最初状态
恳请帮忙看看代码有没有什么问题,这样实现行不行,怎么改比较好,谢谢大家
HTML代码如下:
程序代码:
<!doctype html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. xmlns="http://www. http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="imagecontrol.js"></script> <link href="FuzzyLabCss.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <p> <span class="prev"> <a href class="btn_prev" id="srcprev"></a> </span> <img class="sm" src="testimage\1.jpg" width="130" /> <img class="sm" src="testimage\2.jpg" width="130" /> <img class="sm" src="testimage\3.jpg" width="130" /> <img class="sm" src="testimage\4.jpg" width="130" /> <span class="next"> <a href class="btn_next" id="srcnext"></a> </span> </p> </body> </html>
相关js代码如下:
程序代码:
$(document).ready(function(e) { var im = new Array(); var index = 1; var jpg = ".jpg"; var path = "testimage\\"; var mark = 0; var nowindex = mark; for( ; index <= 20; index++) { var tmp = path + index.toString() + jpg; im.push(tmp); } //滚动按钮实现 $(".btn_prev").click(function(e) { if (mark >= 1) { mark--; nowindex = mark; for(var cnt = 0; cnt <= 3; cnt++) { $(".sm:eq("+cnt+")").attr("src",im[nowindex]); nowindex++; } } }); $(".btn_next").click(function(e) { if (mark <= 16) { mark++; nowindex = mark; for(var cnt = 0; cnt <= 3; cnt++) { $(".sm:eq("+cnt+")").attr("src",im[nowindex]); nowindex++; } } }); });
谢谢大家,恳请帮忙看看有什么问题,怎么改比较好