Results 1 to 3 of 3

Thread: getAttribute addition to slideshow script?

  1. #1
    Join Date
    May 2005
    Location
    Iowa
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Lightbulb getAttribute addition to slideshow script?

    Script: DHTML slide show (manual)
    http://www.dynamicdrive.com/dynamici...dhtmlslide.htm

    I'm having trouble and need help adding a getAttribute method to this script. Here's what I'm trying to accomplish: I don't want to mess with resizing my pictures to fit on my page, I just want to control the placeholder. To do that, I need to dynamically determine the height of the array picture being used at runtime. If the height is >300, I want to calculate a "factor" variable (300 / img height), store 300 to a height variable, multiply the factor times the width and store that to a width variable. Then, on the line that writes the image object, assign the height and width attributes using the calculated variables. Otherwise, if the original image height is <300, store the original image's width and height attributes to those variables. Here's what I did (see the original script):

    var preloadedimages=new Array()
    for (i=0;i<photos.length;i++){
    preloadedimages[i]=new Image()
    preloadedimages[i].src=photos[i]
    var picHeight = photos[i].getAttribute(height) // Added this line
    var picWidth = photos[i].getAttribute(width) // Added this line
    }

    then added this to the actual display routine:

    <script language="JavaScript" type="text/javascript">
    if (linkornot==1)
    document.write('<a href="javascript:transport()">')
    if (picHeight>300) { //Added this line
    factor = 300 / picHeight //Added this line
    dispWidth = picWidth * factor //Added this line
    dispHeight = 300 //Added this line
    } else { //Added this line
    dispWidth = picWidth //Added this line
    dispHeight = picHeight //Added this line
    } //Added this line
    document.write('<img src="'+photos[0]+'" name="photoslider" style="filter:revealTrans(duration=2,transition=23)" border=0 width=dispWidth height=dispHeight>')
    if (linkornot==1)
    document.write('</a>')
    </script>

    But it doesn't work. If anyone has a great idea to make this work, it would be the most killer slide show in the collection. Thanks!

    Regards,
    TechhieTim

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Using document.write is not something you can do to dynamically adjust your HTML code's attributes once written (except in some early browsers). The name of the image:

    photoslider.width=picWidth

    for instance can be used, after the image element tag with that name has been parsed by the browser, to change its width attribute.
    - John
    ________________________

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

  3. #3
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by jscheuer1
    The name of the image:

    photoslider.width=picWidth

    for instance can be used, after the image element tag with that name has been parsed by the browser, to change its width attribute.
    Can, but shouldn't. Instead, obtain a reference properly using the images collection:

    Code:
    document.images['image-name'].width = picWidth;
    Mike

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
  •