Page 3 of 5 FirstFirst 12345 LastLast
Results 21 to 30 of 49

Thread: IE 9 Becoming a Nightmare! May All its Developers Get Fired!

  1. #21
    Join Date
    Dec 2009
    Location
    NY NY USA
    Posts
    138
    Thanks
    101
    Thanked 1 Time in 1 Post

    Default

    Thanks for the info Bernie.
    Coincidentally that site is where I originally got the CSS preload method I was using previously, which was actually working very well as far as preloading the images. John's code correction got rid of the initial white page which was being displayed, and instead now the page is black, as it should be; thereby making the same problem which is still there not as conspicuous. However, IE 9 is still delaying the display of the content on these pages, which doesn't seem to be caused by image loading time -- if I'm interpreting what I see correctly.

  2. #22
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,954
    Thanks
    43
    Thanked 3,195 Times in 3,157 Posts
    Blog Entries
    12

    Default

    I haven't looked exhaustively at the various pages, but aren't those main images the same for all of them? If so those could be put at the beginning of the css file just like the background color was. Like:

    images/brook.gif

    for the td, you could give it a class or id selector in the markup and set its background and other styles in css rather than inline. So instead of having this in the markup:

    Code:
    <td valign="right" width="766" height="424"  style="background-image:url(images/brook.gif); background-position:top right; background-repeat:no-repeat;">
    You could make that like so:

    Code:
    <td id="brookbg">
    And:

    images/bg.gif

    for the body. Then right after the declaration we just modified:

    Code:
    html, body {padding:0; margin:0; color:#ffffff; background-color: #000000 !important;}
    body {background-image: url(/images/bg.gif) !important;}
    #brookbg {
    	width: 766px;
    	height: 424px;
    	background-image:url(/images/brook.gif);
    	background-position: top right;
    	background-repeat: no-repeat;
    }
    That will at least give the browser more of a chance to load those images more quickly.
    Last edited by jscheuer1; 08-25-2012 at 04:05 PM.
    - John
    ________________________

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

  3. #23
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,337
    Thanks
    30
    Thanked 137 Times in 132 Posts
    Blog Entries
    32

    Default

    Hello KennyP,
    These lines:
    Code:
    <META HTTP-EQUIV="Page-Exit" CONTENT="BlendTrans(Duration=0.0)">
    <META HTTP-EQUIV="Page-Enter" CONTENT="BlendTrans(Duration=0.0)">
    don't work in IE9, so even if you follow John's suggestion, the flicker will persist (if there's flicker) with IE9; it won't go away.
    Note also that the flicker is even worse with the Google Chrome browser (try it; it's horrible)
    Preloading images may help or not; there are numerous cases in which it doesn't work.
    In my experience, the only way to get out of this is to put the image(s) explicitly on each page (don't include them via javascript).
    Arie.
    Edit:
    When I posted this answer, I was reading page 1 of your thread and thought that was the whole thing. I only saw afterwards that there had been other answers, so there may be overlap.
    Last edited by molendijk; 08-25-2012 at 09:40 PM. Reason: Correction

  4. #24
    Join Date
    Dec 2009
    Location
    NY NY USA
    Posts
    138
    Thanks
    101
    Thanked 1 Time in 1 Post

    Default

    Thanks once again John, but although logically it should effect an improvement, it actually made the problem more pronounced. It doesn't make sense.
    Last edited by KennyP; 08-26-2012 at 07:16 AM.

  5. #25
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,954
    Thanks
    43
    Thanked 3,195 Times in 3,157 Posts
    Blog Entries
    12

    Default

    Are you sure you had the paths to the images correct?
    - John
    ________________________

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

  6. #26
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,337
    Thanks
    30
    Thanked 137 Times in 132 Posts
    Blog Entries
    32

    Default

    I'd like to add THIS to my previous post and the discussion in general.
    Arie.

  7. #27
    Join Date
    Dec 2009
    Location
    NY NY USA
    Posts
    138
    Thanks
    101
    Thanked 1 Time in 1 Post

    Default

    Yes John. Definitely the paths were correct. It seems that the browser insists on loading a blank page before loading the whole page, or at least delaying the page load.

    Previously, when an image would load on the welcome page, it was cached for all other pages of the site. Is IE 9 different in this regard?


    molendijk: Thanks for your input but I don't understand your point.
    Last edited by KennyP; 08-26-2012 at 09:51 PM.

  8. #28
    Join Date
    Sep 2007
    Location
    The Netherlands
    Posts
    1,337
    Thanks
    30
    Thanked 137 Times in 132 Posts
    Blog Entries
    32

    Default

    Quote Originally Posted by KennyP View Post
    molendijk: Thanks for your input but I don't understand your point.
    Try the link using IE9. When you click on page1, page2 and page3, you'll see that the big background doesn't cause flicker (white flash) on page transition. So there must be a way to accomplish that on your site too.

    Btw, there's a CSS trick for preloading images:
    Code:
    body:after {content: url(your_first_img.jpg) url(your_second_img.jpj) url(your_third_img.jpg)}
    etc.
    Might work in your case. I know it works with Google Chrome, where caching images often poses problems.
    Arie.
    Last edited by molendijk; 08-26-2012 at 10:50 PM. Reason: Adding info

  9. #29
    Join Date
    Dec 2009
    Location
    NY NY USA
    Posts
    138
    Thanks
    101
    Thanked 1 Time in 1 Post

    Default

    Thanks. I'll try that as soon as I get back home.

  10. #30
    Join Date
    Dec 2009
    Location
    NY NY USA
    Posts
    138
    Thanks
    101
    Thanked 1 Time in 1 Post

    Default

    Thanks for your input moledijk:

    If I understood correctly, I tried adding the image urls in the style tag after body as...
    Code:
    content: url(/images/billy-joe-conor.jpg) url(/images/brook.gif);
    but it did not make a difference.

    I also took a look at the links displaying Page 1 Page 2 Page 3 in your sample, and I do notice no flicker is produced in IE 9. However, I'm not sure how to configure the shown code in the pages I'm working on. What do I substitute in place of 'your_external_file_without_big_image.html', and how can I use id="some_div" for additional inages?

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
  •