Hello(An image problem)

anushka · October 13, 2008

Hii

i have a situation .i kept button has an image type(and the image will be of forward/backward).whenever the user clicks on the backward button the image should go show that particular image And i Am using sliding show also

and the code which i have written is here

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>continuous scrolling images</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
body 
#container {
     position:relative;
     width:500px;
     height:300px;
     overflow:hidden;
     border:5px double #000;
     background-color:#fff;
     margin:100px auto 0 auto;
 height:300px;
}
#div1 {
     position:absolute;
     left:0px;
     top:0px;
     width:500px;
     height:500px;
}
#div2 {
     position:absolute;
     left:424px;
     top:0px;
     width:500px;
     height:500px;
}
  #div3 {
    
 position:absolute;
   bottom:0;
   width:100%;
   background:#F6F6F6;
   height:20px;   /* Height of the footer */
   

}

   #div4 {
     position:absolute;
     bottom:0;
   width:100%;
   
    
}
img {
     border:1px solid #000;
     margin:2px;
     float:left;

  }
</style>

<script type="text/javascript">

  var m=0;
  var n=424;
  var speed=20;
function scrollPics() {
     document.getElementById('div1').style.left=m+'px';
     document.getElementById('div2').style.left=n+'px';
   m--;
   n--;
if(m==-424) {
   m=424;
}
if(n==-424) {
   n=424;
}
setTimeout('scrollPics()',speed);
} 
window.onload=function() {
   scrollPics();
}



</script>

</head>
<body>

<div id="container">

<div id="div1">
<img src="snow trees.jpg" height="200" width="200" alt="">
<img src="homepage.jpg" height="200" width="200" alt="">

</div>

<div id="div2">

<img src="windows 2000.jpg"height="200" width="200" alt="">
<img src="solar eclipse.jpg"height="200" width="200" alt="">
</div>

</script>


<div id="div3">
<INPUT TYPE="image" SRC="forward.jpg"  align= "left" VALUE="Submit now"
ALT="Submit now" NAME="Submit now" >
</div>

<div id="div4">
<INPUT TYPE="image" SRC="backward.jpg"   align="right" VALUE="Submit now1"
ALT="Submit now1" NAME="Submit now1" >
</div>
</body>
</html>

Please tel how to do this

EDIT:Code tags...use em'

Sign In

Hello(An image problem)

Recommended Posts

anushka

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information