Jump to:

23483 Posts in 18976 Topics by 2878 members

General Questions

SilverStripe Forums » General Questions » Loading CSS background images before normal images..?

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 5023 Views
  • kevino
    Avatar
    Community Member
    30 Posts

    Loading CSS background images before normal images..? Link to this post

    I have a slideshow on one of my pages which is a bit of a mashup between this slideshow module: http://silverstripe.org/slideshow-module/ and a jquery random image display script.

    It works quite well.

    The problem I have, is loading times of the page.

    According to Firebug's Net tab, the css is loaded first, then the js, then the images for the slideshow, and then finally the css refereneced background images.

    Is there any way that I can make the background images load before the slideshow images, as they obviously hold visual structure of the page. It takes quite a while for all of the slideshow images to load, which therefore holds the whole site up.

    Any ideas?

  • hwi
    Avatar
    Community Member
    5 Posts

    Re: Loading CSS background images before normal images..? Link to this post

    Hi
    just a suggestion - I do not know if it works:

    have you tried to include your specific css background images in your templates html - by this I mean take them in one by one with a normal img tag but with a style of display:none;
    then in theory they should be loaded to the cache of the browser - so when they are called by the css with their final styling rules the browser should be aware of these files already and no need for loading them...

    so something like:
    <img src="/yyyy/yyyy/nav-dot.gif" style="display:none;" />
    <img src="/yyyy/yyyy/leftpane-bg.gif" style="display:none;" />
    and so on...
    somewhere near the top of the html of your template file

    Might wanna give it a try (of course if you have a lot of these this might slow you down even more)

    otherwise I would guess the aproach would be to force the slideshow to wait rather than try to get the css more fast... but I am not a programmer...

    Cheers

  • kevino
    Avatar
    Community Member
    30 Posts

    Re: Loading CSS background images before normal images..? Link to this post

    Nice idea hwi. Thinking outside the box!

    I'l give that a go in the meantime, but would rather get a bonefide solution to delay the ss images from loading.

    Anyone have any ideas there?

    K

  • kevino
    Avatar
    Community Member
    30 Posts

    Re: Loading CSS background images before normal images..? Link to this post

    Hm.
    Unfortunately this doesn't work.

    I can get the images which are used for the backgrounds to load first, which I've confirmed by leaving them visible as a test.
    However, they won't display in position where the background style attribute says to untill after the slideshow images are loaded.

    Anyone else have any good ideas?

  • ChrisBryer
    Avatar
    Community Member
    95 Posts

    Re: Loading CSS background images before normal images..? Link to this post

    you could try loading the background image from a subdomain.. typically images can only load 2 at a time from one domain.

    5023 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.