Help - Search - Members - Calendar
Full Version: how do i add a random photo block?
Movable Type Community Forum > Additional Resources > Tips and Tricks
nyckid
i would like to know how to do this, to make it display a random photo inside a box along with my links, archives, categories, etc...
iosonoio
what d'you mean exactly?
you want to display a random image as part of your template?
in this case you can find useful the code i'm using in my homepage to display images in upper-left corner (try refreshing www.freefallblog.it to see it in action). here it is:
CODE
<script language="JavaScript" type="text/javascript">
   <!--// JavaScript to interpolate random images into a page.
   var ic = 9;     // Number of alternative images
   var xoxo = new Array(ic);  // Array to hold filenames
       
    xoxo[0] = "http://www.freefallblog.it/images/graphic1.jpg";
   xoxo[1] = "http://www.freefallblog.it/images/graphic2.jpg";
   xoxo[2] = "http://www.freefallblog.it/images/graphic3.jpg";
   xoxo[3] = "http://www.freefallblog.it/images/graphic4.jpg";
   xoxo[4] = "http://www.freefallblog.it/images/graphic5.jpg";
   xoxo[5] = "http://www.freefallblog.it/images/graphic6.jpg";
    xoxo[6] = "http://www.freefallblog.it/images/graphic7.jpg";
    xoxo[7] = "http://www.freefallblog.it/images/graphic8.jpg";
    xoxo[8] = "http://www.freefallblog.it/images/graphic9.jpg";

   function pickRandom(range) {
   if (Math.random)
   return Math.round(Math.random() * (range-1));
   else {
   var now = new Date();
   return (now.getTime() / 1000) % range;
    }
   }
  // Write out an IMG tag, using a randomly-chosen image name.
  var choice = pickRandom(ic);
  // -->
  </script>
 
and then

<script LANGUAGE="JavaScript" type="text/javascript">document.writeln('<IMG SRC="'+xoxo[choice]+'" HEIGHT=136 WIDTH=162 BORDER=0 ALT="Refresh it, baby! :)">');</SCRIPT>


or d'you have a photoblog and want to display a random image from your photolog in your homepage?
nyckid
thanks so much, i just want it to randomly select images that i have in my image folder and post it up into that block on my main index template....

i tried implementing this addin, but how am i suppose to get the image to show up? am i missing an extra piece of code?
iosonoio
no extra code.
the first part of the above code is the HEAD part, and the last part
CODE
<script LANGUAGE="JavaScript" type="text/javascript">document.writeln('<IMG SRC="'+xoxo[choice]+'" HEIGHT=136 WIDTH=162 BORDER=0 ALT="Refresh it, baby! :)">');</SCRIPT>

is the one you should place inside of the BODY where you want images to appear.
Aizuddin
Thanks for the Jscript, iosonoio!

Does anyone have any idea how to make the images automatically rotate like an animated .gif?

So, for example, i would have 20 different images in a folder, and the script would pull each one out every 4-5 seconds or so and keep on cycling through them. Essentially, the user does not have to refresh his/her screen to see the new image...

Thanks all.
Cynthia
Thank you for such an easy to do script! I wish all MT plugs were this easy. Nice job.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2009 Invision Power Services, Inc.