图片不能滚动鼠标点击

我正在学习基于本教程的水平图像滚动
http://www.homeandlearn.co.uk/JS/javascript_image_scroller.html。图片不能滚动鼠标点击

然而，无论点击下一张图像还是上一张图像，在6次点击后（第一张图像之后的5张图像）都会弹出相应的提醒。我是新来的java脚本。 PLZ帮我我该怎么错在何处。（我相信我已经把正确的路径名的图像作为第一形象出现，和其他图像下面列出它们）

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
      <script type="text/javascript"> 
    var p1=new Image(); 
    var p2=new Image(); 
    var p3=new Image(); 
    var p4=new Image(); 
    var p5=new Image(); 
    var p6=new Image(); 

    p1.src="page3.png"; 
    p2.src="2.gif"; 
    p3.src="3.gif"; 
    p4.src="4.gif"; 
    p5.src="5.gif"; 
    p6.src="6.gif"; 

    var imgArray=new Array(p1,p2,p3,p4,p5,p6); 
    var counter=0; 
    var end=5; 

    function scroll_backward(){ 
     if (counter==0){ 
      alert("start of pictures"); 
     } 
     else { 
     counter--; 
     } 
     document.pic.src=imgArray[counter].src; 
    } 

    function scroll_forward() { 
     if(counter==end){ 
      alert("No more pictures"); 
     } 
     else{ 
      counter++; 
     } 
     document.pic.src=imgArray[counter].src; 
    } 
     </script> 
    </head> 
    <body> 
    <TABLE width="500"> 
    <TR> 
     <TD height="200" width="100"> 
     <IMG SRC="scrollforward.gif" onClick="scroll_forward()"> 
     </TD> 

     <TD height="300"> 
     <IMG SRC="5.gif" name="pic1"> 
     </TD> 

     <TD width="100"> 
     <IMG SRC="scrollbackward.png" onClick="scroll_backward()"> 
     </TD> 
    </TR> 
    </TABLE> 
    </body> 
    </html>

来源

2014-03-07 Sham

创建的jsfiddle –

什么是'document.pic.src = imgArray [计数器]的.src;'？ –

@ Aashis Mishra在我的理解中应该包含下面列出的图像 – Sham

< IMG名= “PIC” >不PIC1

这个代码将完全为你工作:)

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
      <script type="text/javascript"> 
    var p1=new Image(); 
    var p2=new Image(); 
    var p3=new Image(); 
    var p4=new Image(); 
    var p5=new Image(); 
    var p6=new Image(); 

    p1.src="page3.png"; 
    p2.src="2.gif"; 
    p3.src="3.gif"; 
    p4.src="4.gif"; 
    p5.src="5.gif"; 
    p6.src="6.gif"; 

    var imgArray=new Array(p1,p2,p3,p4,p5,p6); 
    var counter=0; 
    var end=5; 

    function scroll_backward(){ 
     if (counter==0){ 
      alert("start of pictures"); 
     } 
     else { 
     counter--; 
     } 
     document.pic.src=imgArray[counter].src; 
    } 

    function scroll_forward() { 
     if(counter==end){ 
      alert("No more pictures"); 
     } 
     else{ 
      counter++; 
     } 
     document.pic.src=imgArray[counter].src; 
    } 
     </script> 
    </head> 
    <body> 
    <TABLE width="500"> 
    <TR> 
     <TD height="200" width="100"> 
     <IMG SRC="scrollforward.gif" onClick="scroll_forward()"> 
     </TD> 

     <TD height="300"> 
     <IMG SRC="5.gif" name="pic1"> // **here is your problem >>> it was pic not pic1** 
     </TD> 

     <TD width="100"> 
     <IMG SRC="scrollbackward.png" onClick="scroll_backward()"> 
     </TD> 
    </TR> 
    </TABLE> 
    </body> 
    </html>

来源

2014-03-07 10:54:56

图片不能滚动鼠标点击

回答

相关问题