On Sunday, July 7, 2013 12:43:00 PM UTC+7, Ben wrote:
>
> On certain webpages I have embedded images with a spec like:
>
> <img width="640" height="405" src="/.....">
>
> I want to reduce the dimensions of this picture to
>
> <img width="320" height="203" src="/.....">
>
> In order to achieve this I added the following statements to a
> corresponding GM script:
>
> document.querySelector('img[width="600"]').setAttribute('style', 'width:
> 50%;');
> document.querySelector('img[height="405"]').setAttribute('style', 'height:
> 50%;');
>
> The problem is that only the first statement seems to be applied. This is
> bad because the picture is distorted then.
> How can I shrink both width AND height?
>
> Can I merge the first and the second statement into ONE?
>
> Is the odd original height value a problem for GM/CSS renderer? Actually
> the result of 50% of 405 would be 202.5
> which is afaik not a valid height value. Is it auto-rounded?
>
> Isn't it necessary to add an "!important" tag somewhere in the
> setAttribute() command?
>
> Ben
>
>
>
>
Use 'style' property
var elm = document.querySelector('img[width="640"][height="405"]');
elm.style.width = "320px";
elm.style.height = "202.5px";
--
You received this message because you are subscribed to the Google Groups
"greasemonkey-users" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/greasemonkey-users.
For more options, visit https://groups.google.com/groups/opt_out.
