Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: Different image when you press F5

  1. #1
    Join Date
    Mar 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Different image when you press F5

    Hi!

    I looking for a script that will display a different image every time you refresh your page.

    You can load a number of pictures on your site, that can be than displayed like this.

    Thanks!

  2. #2
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Randomly so, or in a "round robin" fashion?
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  3. #3
    Join Date
    Mar 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Randomly, yes.

  4. #4
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Code:
    <img id="randomImage" src="/images/file.png">
    
    <script type="text/javascript">
    var imgs = new Array("/images/file.png", "images/myfile.jpg", "ourfile.gif", "http://www.mysite.com/theirfile.tiff");
    
    document.images['randomImage'].src = imgs[Math.floor(Math.random() * imgs.length)];
    </script>
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  5. #5
    Join Date
    Feb 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default how about a round robin script...

    how would you load images sequentially on page load? round robin style?

    B

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,167
    Thanks
    44
    Thanked 3,240 Times in 3,201 Posts
    Blog Entries
    12

    Default

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    </head>
    <body>
    
    <noscript><img src="files/1_side.jpg"></noscript>
    <script type="text/javascript">
    function robin(){
    //Set Your Images in the below Array:
    var robin_im=['files/1_side.jpg', 'files/2_side.jpg', 'files/3_side.jpg', 'files/5_side.jpg', 'files/8_side.jpg']
    
    //////////////// Stop Editing //////////////////
    function createCookie(name,value,days) {
    	if (days) {
    		var date = new Date();
    		date.setTime(date.getTime()+(days*24*60*60*1000));
    		var expires = "; expires="+date.toGMTString();
    	}
    	else var expires = "";
    	document.cookie = name+"="+value+expires+"; path=/";
    }
    
    function readCookie(name) {
    	var nameEQ = name + "=";
    	var ca = document.cookie.split(';');
    	for(var i=0;i < ca.length;i++) {
    		var c = ca[i];
    		while (c.charAt(0)==' ') c = c.substring(1,c.length);
    		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    	}
    	return null;
    }
    
    function eraseCookie(name) {
    	createCookie(name,"",-1);
    }
    var num=readCookie('robim')? readCookie('robim')*1 : 0;
    document.write('<img src="'+robin_im[num]+'">')
    num=num<robin_im.length-1? num+1 : 0;
    createCookie('robim', num);
    }
    robin();
    </script>
    
    </body>
    </html>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  7. #7
    Join Date
    Feb 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Talking Thank you John

    Thank you very much, it works great. Very nice. I am trying to understand what is happening in the code, but a bit confused. Is this script creating a temporary cookie that contains the number of the last file displayed? and if it is, where is this file created and stored?

    Maybe I should just be happy that there are outstanding coders like John willing to help us noobs out and stop asking questions.

    Thanks again,

    B

  8. #8
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,167
    Thanks
    44
    Thanked 3,240 Times in 3,201 Posts
    Blog Entries
    12

    Default

    You have it pretty much right. Javascript cookies are created and read through an interaction of the browser with the code in the script. They are stored on the user's computer in a directory reserved for them by the browser. This can only happen if the user has cookies enabled, most do.

    The other bit, is what I chose to store in the cookie. I could have chosen various things but I chose to store the array address number representing the next image or 0 if the current image was the last one.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  9. #9
    Join Date
    Feb 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Awsome, thank you for the clarification...

    B

  10. #10
    Join Date
    Oct 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    Hey,

    I was wondering if anyone knew of a way to add a specific size and boarder to this script... I just tried it on a site I was working on, and it seems to work perfectly... but I can't figure out how to adjust the size and border.

    Thanks,
    Tara

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •