soum soum - 7 months ago 19
Javascript Question

using jquery How to alter http parameters of an image src attribute after the image is returned in the browser

I am getting an image tag which looks like this

http://sits-pod18.demandware.net/dw/image/v2/aaen_s31/on/demandware.static/Sites-kerastase-Site/Sites-kerastase-master-catalog/default/v1349421867355/large/Styling/Construct/Mousse_Bouffant_1000x1000.png?sw=226&sh=226', sizingMethod='scale'); border:none;" ;="">

If I simplify this then the http strings for the image tags looks like this

http://sits-pod18.demandware.net/dw/image/v2/aaen_s31/on/demandware.static/Sites-kerastase-Site/Sites-kerastase-master-catalog/default/v1349421867355/large/Styling/Construct/Forme_Fatale_1000x1000.png?sw=350&sh=350

http://sits-pod18.demandware.net/dw/image/v2/aaen_s31/on/demandware.static/Sites-kerastase-Site/Sites-kerastase-master-catalog/default/v1349421867355/large/Styling/Construct/Mousse_Bouffant_1000x1000.png?sw=226&sh=226


There are lets say 10 -15 of these tags enclosed in a divs with a class="foo"

I am trying to alter the sw=226&sh=226 to sw=350&sh=350 using jquery.

How should I approach this? Unfortunately I cant alter the way the image is coming in the page. If I could do that then I would approach to alter the height and the width attribute of the image tag.

Let me know if this sounds confusing then I can try to prepare a fiddle to explain it. The tricky part is it has to work in jquery 1.3.2..which is totally nuts

Thanks in advance

Answer

Try

$('.foo').each(function() {
    this.src = this.src.replace(/=226/g, '=350');
});