WEB need a script like this

Discussion in 'OT Technology' started by AnoesisX, Jun 20, 2008.

  1. AnoesisX

    AnoesisX New Member

    Joined:
    Feb 19, 2005
    Messages:
    2,868
    Likes Received:
    0
    Location:
    Boca Rotten, Florida
    I want a jscript image slider like the one on this site. Anyone Know where i can get something like this?
     
  2. Slid.

    Slid. I'm a guy.

    Joined:
    Oct 25, 2001
    Messages:
    1,928
    Likes Received:
    0
    Location:
    NH
    I'm bored at work ;p.

    http://www.linksling.com/rotate/rotate.htm

    Code:
    <img id="rotateMe" src="img1.jpg" style="width:100px; height:100px;">
    
    <script>
    
    	// how many seconds between transitions?
    	var frequency = 10;
    	
    	// convert to ms
    	var frequencyMs = frequency * 1000;
    	
    	// starting position
    	var curAd = 1;
    						
    	// number of imgs
    	var maxAd = 3;
    	
    	setTimeout("doRotate()", frequencyMs);
    
    	// image array
    	// make sure this corresponds with the maxAd variable
    	var pics=new Array();
    	pics[1]="img1.jpg";
    	pics[2]="img2.jpg";
    	pics[3]="img3.jpg";
    	
    	function doRotate() {
    	  
    	  // step through imgs
    	  var newAd = curAd+1;
    	  newPic = pics[newAd];
    	  
    	  // change image
    	  document.getElementById('rotateMe').src = newPic;
    	  
    	  // step through our counter
    	  curAd = curAd + 1;
    	  
    	  // reset if we've reached the end
    	  if(newAd >= maxAd) curAd = 0;
    	  
    	  // do a rotation in X seconds
    	  setTimeout("doRotate()", frequencyMs);
    	  
    	}
    
    </script>
    
     
  3. Slid.

    Slid. I'm a guy.

    Joined:
    Oct 25, 2001
    Messages:
    1,928
    Likes Received:
    0
    Location:
    NH
  4. AnoesisX

    AnoesisX New Member

    Joined:
    Feb 19, 2005
    Messages:
    2,868
    Likes Received:
    0
    Location:
    Boca Rotten, Florida
    how can i make the pics a link
     
  5. Slid.

    Slid. I'm a guy.

    Joined:
    Oct 25, 2001
    Messages:
    1,928
    Likes Received:
    0
    Location:
    NH
    This will rotate through links too. Added the links array and an href change.

    Code:
    <a id="rotateMeLink" href="1.htm"><img id="rotateMe" src="img1.jpg" style="width:100px; height:100px;"></a>
    
    <script>
    
    	// how many seconds between transitions?
    	var frequency = 10;
    	
    	// convert to ms
    	var frequencyMs = frequency * 1000;
    	
    	// starting position
    	var curAd = 1;
    						
    	// number of imgs
    	var maxAd = 3;
    	
    	setTimeout("doRotate()", frequencyMs);
    
    	// image array
    	// make sure this corresponds with the maxAd variable
    	var pics=new Array();
    	pics[1]="img1.jpg";
    	pics[2]="img2.jpg";
    	pics[3]="img3.jpg";
    	
    	// link array
    	var links=new Array();
    	links[1]="1.htm";
    	links[2]="2.htm";
    	links[3]="3.htm";
    	
    	function doRotate() {
    	  
    	  // step through imgs
    	  var newAd = curAd+1;
    	  newPic = pics[newAd];
    	  newLink = links[newAd];
    	  
    	  // change image
    	  document.getElementById('rotateMe').src = newPic;
    	  
    	  // change link
    	  document.getElementById('rotateMeLink').href = newLink;
    	  
    	  // step through our counter
    	  curAd = curAd + 1;
    	  
    	  // reset if we've reached the end
    	  if(newAd >= maxAd) curAd = 0;
    	  
    	  // do a rotation in X seconds
    	  setTimeout("doRotate()", frequencyMs);
    	  
    	}
    
    </script>
    
     
  6. AnoesisX

    AnoesisX New Member

    Joined:
    Feb 19, 2005
    Messages:
    2,868
    Likes Received:
    0
    Location:
    Boca Rotten, Florida
    how about number links in the corner you can click on to quickly switch to that pic/link.
     

Share This Page