variable "preload"routine ?

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Bob
    #1

    variable "preload"routine ?

    I usually use some "pre-load" code in my pages to preload graphics
    that will be swapped. But, I'm thinking that rather than the
    long, repetitive, once, for each graphic hardcoded stuff like this:

    var bb_off = new Image();
    bb_off.src = "images/bb_off.jpg";

    ....that I could have an array where I just listed the names of the
    graphics, a loop, and code in the loop that cycles through each
    entry in the array to create and pre-load the "on" and "off"
    graphics with code in the loop something like this:

    for (...){
    var temp = array[index] // contains text name for graphic like bb_off
    var eval(temp) = new Image();
    eval(temp).src = "images" +
    eval(temp) + ".jpg"
    }

    But, it seems to choke on the first line - creation of an object
    with an "eval" name. I tried some tricks with string objects but
    there seemed to be problems with that. I suppose I could use a
    document.write and just generate the code, but that seems like a lot
    of extra work for the browser/system. I'd also like to avoid use
    of anything too DOM new as I want backwards compatibility to
    NN4 at least. To top it off, my JS is a little rusty. Is there some
    way to create a variable/object like this with a varying name in JS ?

    Thanks,


    Tags: None
    • McKirahan
      #2
      Re: variable "preload&q uot;routine ?

      "Bob" <uctraingNOSPAM @ultranet.com> wrote in message
      news:oo76uv8qd7 hueb84furg8ca09 rqnedi000@4ax.c om...[color=blue]
      > I usually use some "pre-load" code in my pages to preload graphics
      > that will be swapped. But, I'm thinking that rather than the
      > long, repetitive, once, for each graphic hardcoded stuff like this:
      >
      > var bb_off = new Image();
      > bb_off.src = "images/bb_off.jpg";
      >
      > ...that I could have an array where I just listed the names of the
      > graphics, a loop, and code in the loop that cycles through each
      > entry in the array to create and pre-load the "on" and "off"
      > graphics with code in the loop something like this:
      >
      > for (...){
      > var temp = array[index] // contains text name for graphic like bb_off
      > var eval(temp) = new Image();
      > eval(temp).src = "images" +
      > eval(temp) + ".jpg"
      > }
      >
      > But, it seems to choke on the first line - creation of an object
      > with an "eval" name. I tried some tricks with string objects but
      > there seemed to be problems with that. I suppose I could use a
      > document.write and just generate the code, but that seems like a lot
      > of extra work for the browser/system. I'd also like to avoid use
      > of anything too DOM new as I want backwards compatibility to
      > NN4 at least. To top it off, my JS is a little rusty. Is there some
      > way to create a variable/object like this with a varying name in JS ?
      >
      > Thanks,[/color]


      <body onLoad="doPrelo ad();">

      function doPreload() {
      var the_images = new Array('images/1.jpg','images/2.jpg',
      'images/3.jpg');
      preloadImages(t he_images);
      }
      function preloadImages(t he_images_array ) {
      for (var loop = 0; loop < the_images_arra y.length; loop++) {
      var an_image = new Image();
      an_image.src = the_images_arra y[loop];
      }
      }


      Page 4 - Preloading Images - How's It Done?
      http://hotwired.lycos.com/webmonkey/98/29/index3a_page4.html?tw=programming



        Comment

        • Brian Kerrick Nickel
          #3
          Re: variable &quot;preload&q uot;routine ?

          > for (...){[color=blue]
          > var temp = array[index] // contains text name for graphic like bb_off
          > var eval(temp) = new Image();
          > eval(temp).src = "images" +
          > eval(temp) + ".jpg"
          > }[/color]

          You can't treat eval(temp) as a variable in a declaration. Even if it
          weren't a syntax error, it would equate to var "undefined = new Image();"

          IF this is really how you want to do it, you have two option:
          eval( "var " + temp + " = new Image();" );
          eval( temp + ".src = 'images/" + temp + ".jpg';" );
          OR
          window[ temp ] = new Image( );
          window[ temp ].src = 'images/' + temp + '.jpg';

          A cleaner solution would be to stick each of these items as unnamed
          variables in an array, along the lines of:
          var images = [ 'bb_off', ... ];
          for( var i in images )
          {
          images[ i ].obj = new Image( );
          images[ i ].obj.src = 'images/' + images[ i ] + '.jpg';
          }

          Or, you could work it into a function:
          var preload = function( )
          {
          for( var i = 0; i < arguments.lengt h; i ++ )
          {
          this[ i ] = new Image( );
          this[ i ].src = 'images/' + arguments[ i ] + '.jpg';
          }
          }
          ...
          <body onload="preload ( 'bb_off', ... );">

          - Brian

            Comment

            • Dr John Stockton
              #4
              Re: variable &quot;preload&q uot;routine ?

              JRS: In article <oo76uv8qd7hueb 84furg8ca09rqne di000@4ax.com>, seen in
              news:comp.lang. javascript, Bob <uctraingNOSPAM @ultranet.com> posted at
              Fri, 19 Dec 2003 16:10:39 :-[color=blue]
              >I usually use some "pre-load" code in my pages to preload graphics
              >that will be swapped. But, I'm thinking that rather than the
              >long, repetitive, once, for each graphic hardcoded stuff like this:
              >
              > var bb_off = new Image();
              > bb_off.src = "images/bb_off.jpg";[/color]

              When code is repetitive, you can use a function for it. Then all you
              need write for each image is var bb_off = ImLd("images/bb_off.jpg");
              that is not necessarily quite as compact as using an array, but it is
              easy to read.

              function ImLd(S) { (T = new Image()).src = S ; return T }

              var Sphere = ImLd("$orb.gif" )
              var bb_off = ImLd("images/bb_off.jpg")

              seems to work for me.



              [color=blue]
              > Is there some
              >way to create a variable/object like this with a varying name in JS ?[/color]

              The easiest may be to create an array and index it by the names - i.e.
              not var Fred = ... ; var Jim = ... ; but var Ar = [] ; Ar["Fred"]
              = ... ; Ar["Jim"] = ... ; .

              This also creates a name sub-space for images, which seems clean.

              --
              © John Stockton, Surrey, UK. ?@merlyn.demon. co.uk Turnpike v4.00 IE 4 ©
              <URL:http://jibbering.com/faq/> Jim Ley's FAQ for news:comp.lang. javascript
              <URL:http://www.merlyn.demo n.co.uk/js-index.htm> jscr maths, dates, sources.
              <URL:http://www.merlyn.demo n.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.

                Comment

                Previous template Next
                Working...