Using Javascript to loop images?? - Javascript

On Apr 17, 7:29 pm, OBAFGKM_...@yahoo.com wrote:
> Let's say I have a Javascript function that loops over and over. In
> that function i have it alternating images on a button this way:
>
> if(var==0){
> var myHTML = "<input type='button' style='background-image:
> url(grnbutt.jpg);etc. etc.'>";
> var outq = document.getElementById("qbutt");
> outq.innerHTML = myHTML;
> }
> else{
> var myHTML = "<input type='button' style='background-image:
> url(grnbuttdark.jpg);etc. etc.'>";
> var outq = document.getElementById("qbutt");
> outq.innerHTML = myHTML;
> }
>
> This works great using Firefox, and works with Internet Explorer also
> EXCEPT if its set to "Check for newer versions of stored pages: Every
> visit to the page". With that setting, IE will download those 2 images
> from the server every single time through the loop. So then I tried
> putting both images on the same jpg and then moving the image:
>
> if(var==0){
> var elem = document.getElementById("grn");
> elem.style.backgroundPosition = "-100px 0";
> }
> else{
> var elem = document.getElementById("grn");
> elem.style.backgroundPosition = "center";
> }
>
> This also works, but also, constantly downloads new images when using
> IE with the above setting. Microsoft calls this a "feature". They then
> offer a fix for this "feature" that... doesn't work. Preloading
> doesn't work. Loading the 2 images in a <div> set to invisible doesn't
> work. I've tried suggestions of creating php files that tell the
> browser that the images don't expire for years. That didn't work for
> me. Many people have also suggested that there is no way around it...
> it can't be fixed until Microsoft fixes it.
>
> So, is there any javascript way to loop 2 images on a button, without
> Internet Explorer constantly downloading those 2 images over and over,
> when its set to "Check for newer versions of stored pages: Every visit
> to the page"??

Did you try putting the image in the div, and setting its src argument
to the specified string, having preloaded them before that?
Thinking clearly, however, it makes perfect sense if that doesn't
work, since that exactly was the whole point - they made a feature
that checks for newer versions every time, and now you want to
override this feature - thus directly opposing the user's will -
that's not good design. The user's the boss, not you.

However, the above solution (not setting css, but having x = new
Image( "..." ), then later saying
document.getElementById( "image1" ).src = "...", might work, at least
it's worth a shot?

Thanks Darko. I will try to figure out what you wrote, but I am too
burned out at the moment to try it. However, the Internet Explorer
issue is this: Its supposed to check for a new page on every visit to
that page, NOT download the same image over and over again on the same
page without it being refreshed or revisited. I have no problem with
it downloading fresh images on each visit to the page (which is what
its supposed to do). Its a known bug that has many attempted
solutions. None, so far, have worked.

On Apr 17, 2:34 pm, Darko <darko.maksimo...@> wrote:
> On Apr 17, 7:29 pm, OBAFGKM_...@yahoo.com wrote:
>
>
>
> > Let's say I have a Javascript function that loops over and over. In
> > that function i have it alternating images on a button this way:
>
> > if(var==0){
> > var myHTML = "<input type='button' style='background-image:
> > url(grnbutt.jpg);etc. etc.'>";
> > var outq = document.getElementById("qbutt");
> > outq.innerHTML = myHTML;
> > }
> > else{
> > var myHTML = "<input type='button' style='background-image:
> > url(grnbuttdark.jpg);etc. etc.'>";
> > var outq = document.getElementById("qbutt");
> > outq.innerHTML = myHTML;
> > }
>
> > This works great using Firefox, and works with Internet Explorer also
> > EXCEPT if its set to "Check for newer versions of stored pages: Every
> > visit to the page". With that setting, IE will download those 2 images
> > from the server every single time through the loop. So then I tried
> > putting both images on the same jpg and then moving the image:
>
> > if(var==0){
> > var elem = document.getElementById("grn");
> > elem.style.backgroundPosition = "-100px 0";
> > }
> > else{
> > var elem = document.getElementById("grn");
> > elem.style.backgroundPosition = "center";
> > }
>
> > This also works, but also, constantly downloads new images when using
> > IE with the above setting. Microsoft calls this a "feature". They then
> > offer a fix for this "feature" that... doesn't work. Preloading
> > doesn't work. Loading the 2 images in a <div> set to invisible doesn't
> > work. I've tried suggestions of creating php files that tell the
> > browser that the images don't expire for years. That didn't work for
> > me. Many people have also suggested that there is no way around it...
> > it can't be fixed until Microsoft fixes it.
>
> > So, is there any javascript way to loop 2 images on a button, without
> > Internet Explorer constantly downloading those 2 images over and over,
> > when its set to "Check for newer versions of stored pages: Every visit
> > to the page"??
>
> Did you try putting the image in the div, and setting its src argument
> to the specified string, having preloaded them before that?
> Thinking clearly, however, it makes perfect sense if that doesn't
> work, since that exactly was the whole point - they made a feature
> that checks for newer versions every time, and now you want to
> override this feature - thus directly opposing the user's will -
> that's not good design. The user's the boss, not you.
>
> However, the above solution (not setting css, but having x = new
> Image( "..." ), then later saying
> document.getElementById( "image1" ).src = "...", might work, at least
> it's worth a shot?