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

Thread: Can't get more images to show with this code?

  1. #1
    Join Date
    Oct 2013
    Posts
    59
    Thanks
    0
    Thanked 1 Time in 1 Post

    Default Can't get more images to show with this code?

    Hello.

    I have this old javascript code that I want to use on Halloween for my forum. I have put it in my test forum and it is actually putting the images in a the number it was made for but I want to add more images. When I add them to the array it still only displays six of the images and it also randomly chooses which six it wants to display also? You can open the page and see the images like a ghost and zombie along with four others and then open the page again and it may have dropped the zombie and displayed another?

    I currently have it on my test forum to view:


    http://betaitistheride.freemessageboards.com/

    Here is the code with a added seventh image in the array:


    Code:
    <script type="text/javascript">
    <!--
    
    //Autumn leaves- by Kurt Grigg (kurt.grigg@virgin.net)
    //Modified by Dynamic Drive for NS6 functionality
    //visit http://www.dynamicdrive.com for this script
    //Modified by jscheuer1 in http://www.dynamicdrive.com/forums
    //to fall up, add doctype compatibility & account for
    //differences in speeds among browsers
    
    var speed=60  // 12 to whatever (60 is pretty slow) higher numbers are slower
    Amount=8; //Smoothness depends on image file size, the smaller the size the more you can use!
    
    //Pre-load your image below!
    grphcs=new Array(7)
    Image0=new Image();
    Image0.src=grphcs[0]="http://www.jr-richscooterdoc.com/HW/skel1.gif ";
    Image1=new Image();
    Image1.src=grphcs[1]="http://www.jr-richscooterdoc.com/HW/skel2.gif"
    Image2=new Image();
    Image2.src=grphcs[2]="http://www.jr-richscooterdoc.com/HW/skel3.gif"
    Image3=new Image();
    Image3.src=grphcs[3]="http://www.jr-richscooterdoc.com/HW/skel4.gif"
    Image4=new Image();
    Image4.src=grphcs[4]="http://www.jr-richscooterdoc.com/HW/skel5.gif"
    Image5=new Image();
    Image5.src=grphcs[5]="http://www.jr-richscooterdoc.com/HW/skel6.gif"
    Image6=new Image();
    Image6.src=grphcs[6]="http://www.jr-richscooterdoc.com/HW/skel7.gif"
    
    
    
    //////////////// Stop Editing //////////////
    
    function iecompattest(){
    return (document.compatMode && document.compatMode.indexOf("CSS")!=-1)? document.documentElement : document.body
    }
    
    Ypos=new Array();
    Xpos=new Array();
    Speed=new Array();
    Step=new Array();
    Cstep=new Array();
    ns=(document.layers)?1:0;
    ns6=(document.getElementById&&!document.all||window.opera)?1:0;
    
    speed=ns6? speed-12 : speed
    
    if (ns){
    for (i = 0; i < Amount; i++){
    var P=Math.floor(Math.random()*grphcs.length);
    rndPic=grphcs[P];
    document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0><img src="+rndPic+"></LAYER>");
    }
    }
    else{
    document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    for (i = 0; i < Amount; i++){
    var P=Math.floor(Math.random()*grphcs.length);
    rndPic=grphcs[P];
    document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
    }
    document.write('</div></div>');
    }
    WinHeight=(ns||ns6)?window.innerHeight:window.iecompattest().clientHeight;
    WinWidth=(ns||ns6)?window.innerWidth-70:window.iecompattest().clientWidth;
    for (i=0; i < Amount; i++){                                                                
     Ypos[i] = Math.round(Math.random()*WinHeight);
    Xpos[i] = Math.round(Math.random()*WinWidth);
    Speed[i]= (Math.random()*5+3)*-1;
    Cstep[i]=0;
    Step[i]=Math.random()*0.1+0.05;
    }
    function fall(){
    var WinHeight=(ns||ns6)?window.innerHeight:window.iecompattest().clientHeight;
    var WinWidth=(ns||ns6)?window.innerWidth-70:window.iecompattest().clientWidth;
    var hscrll=(ns||ns6)?window.pageYOffset:iecompattest().scrollTop;
    var wscrll=(ns||ns6)?window.pageXOffset:iecompattest().scrollLeft;
    for (i=0; i < Amount; i++){
    sy = Speed[i]*Math.sin(90*Math.PI/180);
    sx = Speed[i]*Math.cos(Cstep[i]);
    Ypos[i]+=sy;
    Xpos[i]+=sx; 
    if (Ypos[i] < 0 ){
    Ypos[i]=WinHeight+60;
    Xpos[i]=Math.round(Math.random()*WinWidth);
    Speed[i]=(Math.random()*5+3)*-1;
    }
    if (ns){
    document.layers['sn'+i].left=Xpos[i]+wscrll;
    document.layers['sn'+i].top=Ypos[i]+hscrll;
    }
    else if (ns6){
    document.getElementById("si"+i).style.left=Math.min(WinWidth,Xpos[i])+wscrll+'px';
    document.getElementById("si"+i).style.top=Ypos[i]+hscrll-100+'px';
    }
    else{
    document.all["si"+i].style.left=Xpos[i]+wscrll+'px';
    document.all["si"+i].style.top=Ypos[i]+hscrll+'px';
    } 
    Cstep[i]+=Step[i];
    }
    setTimeout('fall()',60);
    }
    
    window.onload=fall
    //-->
    </script>

    I changed this to 7 thinking that would do the trick but not so?

    grphcs=new Array(7)

    Can someone help me fix this so it will display all of the images I want to add?

    Thanks.
    Last edited by jscheuer1; 10-28-2013 at 06:59 AM. Reason: Format

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,920
    Thanks
    43
    Thanked 3,187 Times in 3,151 Posts
    Blog Entries
    12

    Default

    As long as the Amount is equal to or greater than the length of the array (it is here, 8 > 7), it will sometimes. The problem is that each image that's shown is picked at random from the array. In order to be sure to get them all, they must be selected in order with any overflow looping back to the first and starting from there. Make the change (red) to the highlighted line:

    Code:
    else{
    document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    for (i = 0; i < Amount; i++){
    var P=i%grphcs.length;
    rndPic=grphcs[P];
    document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
    }
    But this will result in the same images being picked in the same order each time. If that's OK with you, fine. For a more random effect that selects at least one of each image, use the more recent version of this script that we've been working on in the Autumn Leaves thread. It also has several other advantages over this version.
    Last edited by jscheuer1; 10-31-2013 at 12:22 PM. Reason: typo
    - John
    ________________________

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

  3. #3
    Join Date
    Oct 2013
    Posts
    59
    Thanks
    0
    Thanked 1 Time in 1 Post

    Default

    Sorry John I haven't replied I've been ill I'll check this out and get back

    Thanks

  4. #4
    Join Date
    Oct 2013
    Posts
    59
    Thanks
    0
    Thanked 1 Time in 1 Post

    Default

    John I tried this and I'm a bit confused? I did not find this line you mentioned in this section of code?


    Code:
    else{
    document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    for (i = 0; i < Amount; i++){
    var P=i%grphcs.length);
    rndPic=grphcs[P];
    document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
    }
    I do see a section that is close?

    Code:
    else{
    document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    for (i = 0; i < Amount; i++){
    var P=Math.floor(Math.random()*grphcs.length);
    rndPic=grphcs[P];
    document.write('<img id="si'+i+'" src="'+rndPic+'" style="position:absolute;top:0px;left:0px">');
    }
    I tried this change and it was a real mess up. I changed this line:

    Code:
    var P=Math.floor(Math.random()*grphcs.length);
    To this:

    Code:
    var P=i%Math.floor(Math.random()*grphcs.length);
    But that was a total mess up in fact the software would not keep the small i but rather changed it to a capital I. It wiped out my banner and login page and I'm waiting for a solution from POB to get it out.

    I don't mind the images loading in order, I just want to be able to see all the images I put in the array. I don't want to put in 7 images and the code limit it to 6 and choose what 6 for me to see.

  5. #5
    Join Date
    Oct 2013
    Posts
    59
    Thanks
    0
    Thanked 1 Time in 1 Post

    Default

    Ok I've got things back in order on my site so I'll wait for the next reply.

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,920
    Thanks
    43
    Thanked 3,187 Times in 3,151 Posts
    Blog Entries
    12

    Default

    Change this:

    Code:
    var P=Math.floor(Math.random()*grphcs.length);
    to:

    Code:
    var P=i%grphcs.length;
    Last edited by jscheuer1; 10-31-2013 at 12:23 PM. Reason: typo
    - John
    ________________________

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

  7. #7
    Join Date
    Oct 2013
    Posts
    59
    Thanks
    0
    Thanked 1 Time in 1 Post

    Default

    OK John I did this and the code shuts down, nothing, nada. Not one image will appear or load? So what's next?

    Thanks

  8. #8
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,920
    Thanks
    43
    Thanked 3,187 Times in 3,151 Posts
    Blog Entries
    12

    Default

    Oops, I had a typo. I fixed it in my two previous posts, it should be:

    Code:
    var P=i%grphcs.length;
    Not:

    Code:
    var P=i%grphcs.length);
    - John
    ________________________

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

  9. #9
    Join Date
    Aug 2013
    Posts
    7
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default

    There is nothing wrong in your coding. Only the skel2.gif was not displayed due to a semicolon mistake as seen at JRR's website. If the first image code is rectified without the semicolon as detailed below, all 7 images would be displaying perfectly fine.

    Image0.src=grphcs[0]="http://www.jr-richscooterdoc.com/HW/skel1.gif "; // wrong with a semicolon

    Image0.src=grphcs[0]="http://www.jr-richscooterdoc.com/HW/skel1.gif" // correct without a semicolon

    Rgds
    romeshlogan

  10. #10
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,920
    Thanks
    43
    Thanked 3,187 Times in 3,151 Posts
    Blog Entries
    12

    Default

    That's not exactly true. The semi-colon there is optional. What needs to be removed is that space near the end (after gif and before "):

    Code:
    Image0.src=grphcs[0]="http://www.jr-richscooterdoc.com/HW/skel1.gif ";
    That image probably wasn't showing up. But that has nothing to do with how many images are shown, that's controlled by:

    Code:
    Amount=8; //Smoothness depends on image file size, the smaller the size the more you can use!
    As long as that's equal to or greater than the length of the array of images, they will all be shown, sometimes. To make sure that they're always all shown make the change to (this code is slightly different, before it had a typo):

    Code:
    var P=i%grphcs.length;
    The browser cache may need to be cleared and/or the page refreshed to see changes.

    If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.
    - John
    ________________________

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

Similar Threads

  1. Show/Hide code help
    By wakrah in forum JavaScript
    Replies: 3
    Last Post: 12-22-2009, 04:38 PM
  2. Thumb Pop images On mouse houre images code
    By sreenivasulareddy in forum JavaScript
    Replies: 0
    Last Post: 04-14-2008, 12:30 PM
  3. Flex-Slide Show Images Won't Show
    By stillatlarge in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 09-24-2006, 09:01 PM
  4. having problem with slide show code
    By ashbyfan in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 04-23-2006, 08:30 PM
  5. having problem with slide show code
    By ashbyfan in forum The lounge
    Replies: 1
    Last Post: 04-23-2006, 08:30 PM

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
  •