CSS Codes
CSS Layouts
Results 1 to 3 of 3

Thread: Loading some images first out of 40 images

  1. 07-23-2008, 08:45 PM #1
    mtran
    mtran is offline Junior Coders
    Join Date
    Nov 2005
    Location
    Austin TX,US
    Posts
    71
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default Loading some images first out of 40 images

    Hi, I have a page with more than 40 product images fall under 4 categories.
    Each category has a main image. The other images are hidden and only revealed when users click on a Category name.

    I'm wondering if there is a way to load the 4 main images first so that the page will look more complete when people just enter? Thanks for the input!

    By the way, I can't add anything to the <HEAD> section because I'm in a position where the HEAD part is under the corporate level - somebody else control it.
    Last edited by mtran; 07-23-2008 at 09:07 PM.
    Reply With Quote Reply With Quote
  2. 07-24-2008, 06:03 AM #2
    Dal
    Dal is offline Regular Coders
    Join Date
    Jul 2008
    Posts
    102
    Thanks
    36
    Thanked 6 Times in 6 Posts

    Default

    As far as Im aware, you need to have access to the head to do this as anywhere else is accessed really after the document has loaded so there would be no point in preloading. You could put a code block at the bottom of the document to populate the remaining images and just hard code the first 4 in manually. Im unaware if there is any way to define image loading order other than document flow.

    Try re-organising the code so that the document reads the first 4 as close at the top as you can make it although different browsers such as Opera make there own rules up with image downloading.

    Good luck
    Dal
    Programmers are tools used to convert Caffeine to code
    Reply With Quote Reply With Quote
  3. 07-24-2008, 07:01 AM #3
    jscheuer1's Avatar
    jscheuer1
    jscheuer1 is offline Global Moderator
    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

    One thing you could try, a sort of "poor man's preloading", would be to put a division at the top of your page, just after the opening <body> tag:

    HTML Code:
    <div style="position:absolute;top:-2000px;left:-2000px;visibility:hidden;">
<img src="image1.jpg"><img src="image2.jpg"><img src="image3.jpg"><img src="image4.jpg">
</div>
    This will not be seen or take up any layout space (due to the style on the division tag), but due to the rules governing HTML and css style, the images will be parsed and loaded. Use your four image sources though instead of the generic image1.jpg, image2.jpg, etc. that I have in there. Since they will then be the first images on the page, they should be the first images to load.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate
    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

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
  •  

Forum Rules