0
Welcome Guest! Login
0 items Join Now

SOLVED Preferred way of preloading images in Gantry 5?

    • Web Guy's Avatar
    • Web Guy
    • Newbie
    • Posts: 16
    • Thanks: 0

    SOLVED Preferred way of preloading images in Gantry 5?

    Posted 5 years 8 months ago
    • Hey all.

      Does anyone know what is the preferred way of reloading images in Gantry 5 (or Joomla)?

      What I'm doing at the moment is adding some javascript to the Gantry 5 template>Page Setting>Custom Content;

      <script type="text/javascript">
      var my_image = new Image();
      my_image.src = '../images/myimage.jpg';
      </script>

      1. Will that actually preload the image before the page loads?
      2. Is there a better way?

      Cheers
      (PS Gantry 5 is fantastic!)
    • Matt's Avatar
    • Matt
    • Preeminent Rocketeer
    • Posts: 21506
    • Thanks: 3082
    • messin' with stuff

    Re: SOLVED Preferred way of preloading images in Gantry 5?

    Posted 5 years 8 months ago
    • I'm not sure what you're trying to do... no... you can't load an image before the page loads

      developers.google.com/web/fundamentals/p...er-tree-construction

      What do you mean by "re"load?

      Custom scripts and development are generally beyond the scope of support here.
    • The following users have thanked you: Web Guy

    • SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT :woohoo:
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: SOLVED Preferred way of preloading images in Gantry 5?

    Posted 5 years 8 months ago
    • If you want a proper preloader then take a look at aikon super-preloader. Make sure it’s what you want though because it’s not free. Alternately just use my suggestion here.

      Regards, Mark
    • Last Edit: 5 years 8 months ago by MrT.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: SOLVED Preferred way of preloading images in Gantry 5?

    Posted 5 years 8 months ago
    • www.rockettheme.com/forum/gantry5-for-jo...-on-load-in-gantry-5
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • Web Guy's Avatar
    • Web Guy
    • Newbie
    • Posts: 16
    • Thanks: 0

    Re: SOLVED Preferred way of preloading images in Gantry 5?

    Posted 5 years 8 months ago
    • Thanks for the replies all. Sorry, I did mean PREload, not REload (opps!)
      So yeah, I was trying to preload the images before the page loads (as my main background image is a bit large, so tends to display a fraction of a second after the content.

      I'll try the various suggestions here, thanks again.
    • Web Guy's Avatar
    • Web Guy
    • Newbie
    • Posts: 16
    • Thanks: 0

    Re: SOLVED Preferred way of preloading images in Gantry 5?

    Posted 5 years 8 months ago
    • One thing I forgot to ask was, is there a way to load images which are used in other pages when I open the homepage?
      EG. When I open the homepage, it will also load (go into the browser cache) various images used in other pages such as domain/myservices, domain/aboutus. The point being, when someone finishes reading the homepage and clicks on MyServices page, the images have already been loaded/in the browser cache, speeding up the user experience.
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13481
    • Web Designer/Developer

    Re: SOLVED Preferred way of preloading images in Gantry 5?

    Posted 5 years 8 months ago
    • That doesn't really make sense. Once any image has been presented your browser has already cached it (the same for joomla too if you have caching on). But to force images to load in the home page (that are not used in the home page) just means that your home page is going to take a lot longer to load. Really you should keep each page to only load that which it requires itself. The preloader Suggections that I made will work on all of your pages. and only present the page once it has been fully rendered in the browser. (either by fading out or with a spinner).

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
    • Web Guy's Avatar
    • Web Guy
    • Newbie
    • Posts: 16
    • Thanks: 0

    Re: SOLVED Preferred way of preloading images in Gantry 5?

    Posted 5 years 8 months ago
    • Thanks Mark. Yeh, that makes sense.

      My idea was to somehow load images for other pages, once the homepage had rendered / viewable / usable. So the user would open homepage and while they're reading through it, the site is loading images into local browser cache for use in other pages.
      But I guess in the age of 4G speeds, I'm overthinking this!

      Anyway, thanks for ideas.

Time to create page: 0.042 seconds