kristianfrandsen.com » picture http://kristianfrandsen.com En nørds hverdag Thu, 22 Sep 2011 11:11:03 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 Piglet in quarantine http://kristianfrandsen.com/2009/11/piglet-in-quarantine/ http://kristianfrandsen.com/2009/11/piglet-in-quarantine/#comments Wed, 25 Nov 2009 15:22:38 +0000 Kristian Ellebæk Frandsen http://kristianfrandsen.com/?p=318 Hello,

Just found a little funny Winnie the Pooh picture… :)

Credits to the artist!

]]> http://kristianfrandsen.com/2009/11/piglet-in-quarantine/feed/ 0 JavaScript Picture Slider http://kristianfrandsen.com/2009/03/javascript-picture-slider/ http://kristianfrandsen.com/2009/03/javascript-picture-slider/#comments Tue, 24 Mar 2009 15:15:30 +0000 Kristian Ellebæk Frandsen http://kristianfrandsen.com/?p=252

Hello,

I was coding this little Picture Slider in JavaScript for a colleague and thought: Why not just share it with everybody else?

So here it is people… It is not advanced, it is not high-tech… but it is simple!

  1. <html>
  2.  
  3. <head>
  4. <title>Picture Slider</title>
  5.  
  6. <script type="text/javascript">
  7. // Setup
  8. var imagePath = "images/"; // Path to image-folder
  9. var images = new Array("image1.jpg",
  10.                        "image2.jpg",
  11.                        "image3.jpg",
  12.                        "image4.jpg",
  13.                        "image5.jpg"); // filenames of the images
  14. var slideInterval = 1.5; // amount of seconds before sliding forward
  15.  
  16. // Variabels
  17. var curImage = 0;
  18.  
  19. // Fucntions
  20. function startSlide() {
  21.     setTimeout("nextSlide()", slideInterval * 1000);
  22. }
  23.  
  24. function nextSlide() {
  25.     var viewer = document.getElementById("imageViewer");
  26.     curImage = curImage + 1;
  27.  
  28.     if (images[curImage] == null)
  29.         curImage = 0;
  30.  
  31.     viewer.src = imagePath + images[curImage];
  32.  
  33.     setTimeout("nextSlide()", slideInterval * 1000);
  34. }
  35.  
  36. // Start the slider
  37. startSlide();
  38. </script>
  39. </head>
  40.  
  41. <body>
  42.  
  43. <h1>Picture Slider</h1>
  44. <br />
  45. <img id="imageViewer" src="images/image1.jpg">
  46.  
  47. </body>
  48.  
  49. </html>

Just change the variables under the “setup” in the start of the JavaScript-code and change the src-parameter on the img-tag of the picture to show the first picture. Then the script will work.

Have fun !!

/KEF

]]> http://kristianfrandsen.com/2009/03/javascript-picture-slider/feed/ 0