Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Aug 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    cant get javascript document.write images to be under other content

    this is sort of a javascript/html/css question:

    im using a javascript to randomly position many small images on the page,
    and i want them to be in the background relative to other content on the page. for example, the command below is run a bunch of times in a javascript in my header, which i call from the body:

    document.write('<img src="./images/' + img_rnd[i] + '" style="z-index: 1; position: absolute; left:' + x[i] + '; top: ' + y[i] + '; width: ' + img_width + '; height: ' + img_height + ';"></img>');

    despite setting z-indexes to 2 for my divs/layrs/tables in the body, i cant get them to overlap the images positioned by the document.write call.

    is there a better/different way to get these images to be "in the background"?

    thanks,
    sam

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    In my oppinion you should have used DOM methods to create the elements and their attributes, not the obsolate document.write() method
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #3
    New to the CF scene
    Join Date
    Aug 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    so what your saying is use statements like??

    document.images[i].src="./images/" + img_rnd[i];
    document.images[i].height=img_width;
    document.images[i].width=img_height;

    can i use the DOM to position, resize, and layer the images
    behind other content?

  • #4
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Could be something like this:
    Code:
    //inside your i loop
    ...
    var root=document.getElementById('mydiv'+i);//the node where to append the image
    var pic=document.createElement('img');
    var att=[
    ['width',img_width],['height',img_height],['src','./images/'+img_rnd[i]]
    ]
    for(var j=0;j<att.length;j++){
    pic.setAttribute(att[j][0],att[j][1]);
    }
    var css=[
    ['position','absolute'],['zIndex',1],['left',x[i]+'px'],['top',y[i]+'px']
    ]
    for(var j=0;j<css.length;j++){
    pic.style[css[j][0],css[j][1]];
    }
    ...
    root.appendChild(pic);
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*


  •  

    Posting Permissions

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