JS:幻灯片显示不准确的结果

时间:2015-07-23 22:08:33

标签: javascript html slideshow

您好我写这个简单的javascript幻灯片,因为我想在javascript中编写自己的幻灯片。它会按设定的时间间隔自动更改图像。但是当我尝试单击向后和向前功能时,结果不准确或图像按顺序排列。



	var images = ["http://i1214.photobucket.com/albums/cc487/myelstery/1.jpg","http://i1214.photobucket.com/albums/cc487/myelstery/2.jpg","http://i1214.photobucket.com/albums/cc487/myelstery/3.jpg"];

	var i = 0;
	var count = images.length; 
	
	function slidingImages() 
	{
			i = i % count;
			document.banner.src = images[i];
			i++;
	}
	
	function forward()
	 {
		 i = (i + 1) % count;
		 document.banner.src=images[i];
	 }
	 
	function backward() 
	{
		if (i <= 0) 
		{
			i = count - 1;
		} 
		else 
		{
			i--;
		}
		document.banner.src=images[i];
	}
	 
	window.onload = function() 
	{
	  slidingImages(),setInterval(slidingImages, 3000)
	};	
&#13;
<center>
<p>
<img src="images/1.jpg" name="banner" id="name"/>
</p>
<input type="button" value="&laquo;prev" onClick="backward()"> 
<input type="button" value="next&raquo;" onClick="forward()">
</center>
&#13;
&#13;
&#13;

解决方案是什么,所以我的幻灯片是准确的?

1 个答案:

答案 0 :(得分:1)

当鼠标位于红色矩形内时,这将暂停自动行为,并在鼠标离开红色矩形后继续处于自动模式。按钮当然按预期工作。

class Foo
{
    public function xyz()
    {
        echo "Called","\n";
        return $this;
    }
}

function Foo()
{
    return new Foo();
}

$a = Foo()->xyz();