The forums have permanently moved to forum.kirupa.com. This forum will be kept around in read-only mode for archival purposes. To learn how to continue using your existing account on the new forums, check out this thread.


Results 1 to 3 of 3

Thread: javascript: <img> tag, using a given width/height, get proportions right

  1. #1

    javascript: <img> tag, using a given width/height, get proportions right

    Sorry for the cryptic post title, here's what's bugging me:

    I have an array containing relative paths of images and whether they are taller than they are wide.

    Using javascript I want to display a random image every x seconds (this is for an active desktop)

    The arrayFile.js is set like this, imgArray = ('file1.jpg,wider',''file2.jpg,taller'...);
    PHP Code:
    <head>
    <
    script src="arrayFile.js"></script>
    <script language="JavaScript">
     function init(){
         randomImageNumber = Math.round(Math.random()*imgArray.length);
         if(imgArray[randomImageNumber].split(',')[1] == 'taller'){
        document.images['tt'].height = "768";
         }else{
            document.images['tt'].width = "1024";       
         }
         document.images['tt'].src = 'path\/'+imgArray[randomImageNumber].split(',')[0];
         setTimeout('init()',5000);
         }
        </script>
    </head> 
    And in the body:
    PHP Code:
       <body onload="init()">
        <
    img src='' name='tt'>
       </
    body
    Now the images get displayed every 5 seconds BUT proportions get mixed up. If the image is wide, it will use a 1024 pixel width but also the previous image's height, which means that very quickly all the images become 1024x768 regardless of the real width/height proportions (and a 2000x1000px image looks MUCH better using 1024x512pxs than 1024x768px)

    Long story short, how can I tell internet explorer to figure out the length of the shorter side by itself. I've tried 'emptying' width height variables:
    PHP Code:
         if(imgArray[randomImageNumber].split(',')[1] == 'taller'){
            
    document.images['tt'].width "";
            
    document.images['tt'].height "768";
         }else{
            
    document.images['tt'].height "";       
            
    document.images['tt'].width "1024";       
         } 
    But all i get are 0x768px or 1024x0px images.

    Have I confused everyone or is someone able to help ?

    Thanks !

    mlk

  2. #2
    176
    posts
    Registered User
    i think i understand what you mean ... havne't tried anything ... but u think it could be cuz you're trying to set the width/height before source.
    PHP Code:
    <zip> echo this; </zip

  3. #3
    once again thanks for your post, will try that !

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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

Home About kirupa.com Meet the Moderators Advertise

 Link to Us

 Credits

Copyright 1999 - 2012