如何在jquery中制作silder [英] How to make silder in jquery
本文介绍了如何在jquery中制作silder的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
<!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>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script language="javascript" type="text/javascript">
var _index = 1;
var myVar;
var _time = 2000;
$(document).ready(function () {
myFunction();
});
function Silder() {
var myarray = ['1.jpg', '2.jpg', '3.jpg', '4.jpg'];
if (_index > myarray.length) {
_index = 1;
}
$('#mainsilde').fadeOut('slow');
$("#mainsilde").attr("src", "gal/" + _index + ".jpg");
$('#mainsilde').fadeIn('slow');
_index = _index + 1;
myVar = setTimeout(Silder, _time);
}
function SetOnCall(_index) {
// $('#mainsilde').fadeOut('slow');
$("#mainsilde").attr("src", "gal/" + _index + ".jpg");
// $('#mainsilde').fadeIn('slow');
}
function myFunction() {
myVar = setTimeout(Silder, _time);
}
function myStopFunction(_index) {
clearTimeout(myVar);
SetOnCall(_index);
}
</script>
</head>
<body>
<table>
<tr>
<td valign="top">
<div >
<img src="gal/1.jpg" class="dup" width="100px" onmouseover="myStopFunction(1);" onmouseout="myFunction();" />
</div>
<div class="dup">
<img src="gal/2.jpg" class="dup" width="100px" onmouseover="myStopFunction(2);" onmouseout="myFunction();" />
</div>
<div >
<img src="gal/3.jpg" class="dup" width="100px" onmouseover="myStopFunction(3);" onmouseout="myFunction();"/>
</div >
<div >
<img src="gal/4.jpg" class="dup" width="100px" onmouseover="myStopFunction(4);" onmouseout="myFunction();" />
</div>
</td>
<td valign="top">
<img src="gal/0.jpg" id="mainsilde" width="430px" height="340px" onmouseover="wait(0);" onmouseout="wait(1);"/>
</td>
<td valign="top">
<div >
<img src="gal/1.jpg" class="dup" width="100px" onmouseover="myStopFunction(1);" onmouseout="myFunction();" />
</div>
<div class="dup">
<img src="gal/2.jpg" class="dup" width="100px" onmouseover="myStopFunction(2);" onmouseout="myFunction();" />
</div>
<div >
<img src="gal/3.jpg" class="dup" width="100px" onmouseover="myStopFunction(3);" onmouseout="myFunction();"/>
</div >
<div >
<img src="gal/4.jpg" class="dup" width="100px" onmouseover="myStopFunction(4);" onmouseout="myFunction();" />
</div>
</td>
</tr>
</table>
</body>
</html>
推荐答案
（文件）.ready（function（）{
myFunction（）;
}）;
function Silder（）{
var myarray = ['1.jpg'，'2.jpg'，'3.jpg'，'4.jpg'];
if（_index> myarray.length）{
_index = 1;
}
(document).ready(function () { myFunction(); }); function Silder() { var myarray = ['1.jpg', '2.jpg', '3.jpg', '4.jpg']; if (_index > myarray.length) { _index = 1; }
（'＃mainsilde'）。fadeOut（'slow'）;
('#mainsilde').fadeOut('slow');
（＃mainsilde）。attr（ src，gal /+ _index +.jpg）;
("#mainsilde").attr("src", "gal/" + _index + ".jpg");
这篇关于如何在jquery中制作silder的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
