Question

I want to be able to change a url directory for, e.g. the first <img> in a <div>, or, any image that is not the first.

My reason is that the loading speed is too slow. That’s because I used CSS to generate thumbnails from larger images. I now want to redirect those thumbnail images to a thumbnail folder with small images, rather than having to redirect them individually, which would be a pain.

<img src="images/stories/Images_for_Web/baths_windowToTheSoul_WB4_p90.jpg">
<img src="images/stories/Thumbs/baths_windowToTheSoul_WB4_p90.jpg">

here is the link to the site I’m working on: http://www.d1187169-1.cp.blacknight.com/whitebook1/

I have the CSS automatically resizing and cropping the images for any that is not the first. I like that solution as it will save work in the future so if this part could work also, it would be brilliant, unfortunately I just know CSS, HTML, a little Joomla and only starting in javascript etc., but I am willing to try anything to get this to work!

Any thoughts or suggestions much appreciated. Thanks, Paul

Answer 1

If you were to use jQuery, you could do the following:

$("#somediv img:first").attr("src", "images/new/location");

As you can see just one line of code thanks to the CSS-like selectors. I highly recommend using jQuery for such tasks.