views:

48

answers:

2

So I was using yslow for firefox and my page weight was way high. My page has a main product image and then maybe 10 thumbnails. If you click a thumbnail, the image opens up in a popup done through jquery. The problem is, yslow is listing even the targets of the thumbnails as part of the page weight, so I guess for some reason the images are downloading.

For example, I have:

<a class="group nyroModal" rel="lightbox-group" href="/upload/topview.jpg">
<img alt="thumbnail" src="/upload/thumb/t_topview.jpg" />
</a>

Would this normal html cause the "upload/topview.jpg" to automatically download? Or is it the jquery plugin "nyroModal"? I'd rather the images didn't preload, that'd waste a lot of bandwidth.

So my question is, does a browser automatically try to download image files that are in the href property of anchors, or is the plugin most likely causing this?

Thanks for any direction you can give me.

+6  A: 

No, the browser does not download that href on it's own. I would guess your jquery plugin is following the link to preload it. How to disable that is probably in the docs of the plugin somewhere.

Squeegy
Yep, it's gotta be in your plugin.
Shawn Steward
YSlow generally only detects HTTP requests that are actually sent, so your jQuery plugin is either preloading the image, or YSlow somehow knows that the image might be dynamically loaded. I'm putting more belief in the first.
S Pangborn
+1  A: 

As Squeegy said, the browser is not doing this on its own... I looked at the nyroModal website and it's not part of the default code for that plugin either.

Preloading Images is not considered to be a part of the plugin, as you probably need to preload other images for your website. If you need to do so, you can use this code.

So, do you have other code somewhere else that's doing the preloading? Here is a basic preload image function that you may be able to use to find where this is happening. Search your code for the = new Image() portion and you may be able to find it.

  function preloadImg(image) {
    var img = new Image();
    img.src = image;
  }
Shawn Steward