Jump to content

OMpdx

Members
 View Profile  See their activity

  • Posts

    2

  • Joined

  • Last visited

 Content Type 

Posts posted by OMpdx

    newbie - randomize images on refresh

    in JavaScript

    Posted

     

    You could try something like this...

    <!DOCTYPE html><html lang="en"><head><meta charset="utf-8"/><title>title</title><style>img{height:120px;}</style><script>window.onerror = function(m, u, l){alert('Javascript Error: '+m+'nURL: '+u+'nLine Number: '+l);return true;}</script><script>window.onload = init;function init() {var list = document.getElementsByClassName('randimg');var img = [];var len = list.length;//alert('len='+len);for (var i=0 ; i<len ; i++){img[i] = {};img[i].src = list[i].src;//alert(img[i].src);}var cnt = 0;var idx;while(cnt<len){idx = Math.floor(Math.random() * len);if (img[idx].src!=''){//alert('assigning img['+ idx +']='+ img[idx].src +' to list['+ cnt +']');list[cnt].src = img[idx].src;img[idx].src='';cnt++;}}}</script></head><body><img class="randimg" src="v/vspfiles/assets/images/homepage/img_1.jpg" alt="garments for life"/><img class="randimg" src="v/vspfiles/assets/images/homepage/img_2.jpg" alt="garments for life"/><img class="randimg" src="v/vspfiles/assets/images/homepage/img_3.jpg" alt="garments for life"/><img class="randimg" src="v/vspfiles/assets/images/homepage/img_4.jpg" alt="garments for life"/><img class="randimg" src="v/vspfiles/assets/images/homepage/img_5.jpg" alt="garments for life"/></body>    </html>

    thanks! i think we're getting somewhere... this does randomize, but i'm still getting all images showing simultaneously. i'm hoping for one image in the banner at a time. then if the person goes to a different page and comes back to Home then they'll see a different image (from the 5).

    newbie - randomize images on refresh

    in JavaScript

    Posted

    I know nothing about code. I started with a web template and I want to simply make the banner image random between 5 images I have saved to my ftp. I don't need scrolling or fading or anything, I just want the image to be different every time someone hits or returns to the homepage.

     

    I'm starting with the most basic HTML, and I renamed the images to be sequential:

     

    <img src="v/vspfiles/assets/images/homepage/img_1.jpg" alt="garments for life"/>

    <img src="v/vspfiles/assets/images/homepage/img_2.jpg" alt="garments for life"/>

    <img src="v/vspfiles/assets/images/homepage/img_3.jpg" alt="garments for life"/>

    <img src="v/vspfiles/assets/images/homepage/img_4.jpg" alt="garments for life"/>

    <img src="v/vspfiles/assets/images/homepage/img_5.jpg" alt="garments for life"/>

     

    I appreciate any help.

     

     

×
×
  • Create New...