Re: [xul-interop] How to get image width?
Evgeny <[email protected]> Fri, 8 Oct 2010 22:40:54 +0400
| Newsgroups | gmane.comp.lang.xul.general |
|---|---|
| Message-ID | <[email protected]> |
--===============7949885434118068843==
Content-Type: multipart/alternative; boundary=90e6ba4fc272c88cf004921f59b1
--90e6ba4fc272c88cf004921f59b1
Content-Type: text/plain; charset=ISO-8859-1
At first you should wait while image gets loaded.
If you run your script after window.onload fired and image is created static
with <image src="..."> than image is loaded.
But if you create image with javascript createElement('image') you should
have image onload or onreadystatechange handlers.
Try element.*offsetWidth *to get width and element.*offsetHeight *for height
Also if offsetWidth doesn't work for some reasons (and you work in mozilla)
you can try methods element.getBoundingClientRect() which returns structure
with left, top,right,bottom fields, or document.getBoxObjectFor(element)
As far as I remember they work in different versions of mozilla's gecko
On Fri, Oct 8, 2010 at 9:27 PM, Tom Brito <[email protected]> wrote:
> Hi!
>
> I'm working with images, and if I don't specify an width and height to an
> image it fits the exactly size of the image (didn't tested for images larger
> then the screen).
>
> What I would like to do is get the width of this loaded image, so I can
> calculate to put it in the center of the screen with (screen/width/2 -
> image.width/2),
> any idea how to get loaded image's width?
>
> Trying with:
>
> var image = getElementById('loadingImage');
>
>
> image.width returns nothing..
>
>
> *
> Wellington B. de Carvalho
> *
>
>
> ------------------------------------------------------------------------------
> Beautiful is writing same markup. Internet Explorer 9 supports
> standards for HTML5, CSS3, SVG 1.1, ECMAScript5, and DOM L2 & L3.
> Spend less time writing and rewriting code and more time creating great
> experiences on the web. Be a part of the beta today.
> http://p.sf.net/sfu/beautyoftheweb
> _______________________________________________
> XUL News Wire - http://xulnews.com
> XUL Job Postings - http://xuljobs.com
> Open XUL Alliance - http://xulalliance.org
> _______________________________________________
> xul-talk mailing list
> [email protected]
> https://lists.sourceforge.net/lists/listinfo/xul-talk
>
>
--90e6ba4fc272c88cf004921f59b1
Content-Type: text/html; charset=ISO-8859-1
Content-Transfer-Encoding: quoted-printable
At first you should wait while image gets loaded.<br>If you run your script=
after window.onload fired and image is created static<br>with <image sr=
c=3D"..."> than image is loaded.<br>But if you create image wi=
th javascript createElement('image') you should have image onload o=
r onreadystatechange handlers.<br>
Try element.<b>offsetWidth </b>to get width and element.<b>offsetHeight </b=
>for height<br><br>Also if offsetWidth doesn't work for some reasons (a=
nd you work in mozilla) you can try methods element.getBoundingClientRect()=
which returns structure with left, top,right,bottom fields, or document.ge=
tBoxObjectFor(element)<br>
As far as I remember they work in different versions of mozilla's gecko=
<br><br><br><br><div class=3D"gmail_quote">On Fri, Oct 8, 2010 at 9:27 PM, =
Tom Brito <span dir=3D"ltr"><<a href=3D"http://brito.pro">brito.pro</a>@=
<a href=3D"http://gmail.com">gmail.com</a>></span> wrote:<br>
<blockquote class=3D"gmail_quote" style=3D"margin: 0pt 0pt 0pt 0.8ex; borde=
r-left: 1px solid rgb(204, 204, 204); padding-left: 1ex;">Hi!<div><br></div=
><div>I'm working with images, and if I don't specify an width and =
height to an image it fits the exactly size of the image (didn't tested=
for images larger then the screen).</div>
<div><br></div>
<div>What I would like to do is get the width of this loaded image, so I ca=
n calculate to put it in the center of the screen with (screen/width/2 - im=
age.width/2),</div><div>any idea how to get loaded image's width?</div>
<div><br></div><div>Trying with:</div><blockquote style=3D"margin: 0pt 0pt =
0pt 40px; border: medium none; padding: 0px;"><div><font face=3D"'couri=
er new', monospace">var image =3D getElementById('loadingImage'=
);</font></div>
</blockquote><div><br></div><div><font face=3D"'courier new', monos=
pace">image.width</font> returns nothing..</div><div><div><br></div><div><b=
r></div><i><div style=3D"text-align: left;"><span style=3D"font-style: norm=
al;"><i>Wellington B. de Carvalho</i></span></div>
</i><br>
</div>
<br>-----------------------------------------------------------------------=
-------<br>
Beautiful is writing same markup. Internet Explorer 9 supports<br>
standards for HTML5, CSS3, SVG 1.1, =A0ECMAScript5, and DOM L2 & L3.<br=
>
Spend less time writing and =A0rewriting code and more time creating great<=
br>
experiences on the web. Be a part of the beta today.<br>
<a href=3D"http://p.sf.net/sfu/beautyoftheweb" target=3D"_blank">http://p.s=
f.net/sfu/beautyoftheweb</a><br>___________________________________________=
____<br>
XUL News Wire =A0 =A0 =A0- <a href=3D"http://xulnews.com" target=3D"_blank"=
>http://xulnews.com</a><br>
XUL Job Postings =A0 - <a href=3D"http://xuljobs.com" target=3D"_blank">htt=
p://xuljobs.com</a><br>
Open XUL Alliance - <a href=3D"http://xulalliance.org" target=3D"_blank">ht=
tp://xulalliance.org</a><br>
_______________________________________________<br>
xul-talk mailing list<br>
<a href=3D"mailto:[email protected]">[email protected]=
e.net</a><br>
<a href=3D"https://lists.sourceforge.net/lists/listinfo/xul-talk" target=3D=
"_blank">https://lists.sourceforge.net/lists/listinfo/xul-talk</a><br>
<br></blockquote></div><br>
--90e6ba4fc272c88cf004921f59b1--
--===============7949885434118068843==
Content-Type: text/plain; charset="us-ascii"
MIME-Version: 1.0
Content-Transfer-Encoding: 7bit
Content-Disposition: inline
------------------------------------------------------------------------------
Beautiful is writing same markup. Internet Explorer 9 supports
standards for HTML5, CSS3, SVG 1.1, ECMAScript5, and DOM L2 & L3.
Spend less time writing and rewriting code and more time creating great
experiences on the web. Be a part of the beta today.
http://p.sf.net/sfu/beautyoftheweb
--===============7949885434118068843==
Content-Type: text/plain; charset="us-ascii"
MIME-Version: 1.0
Content-Transfer-Encoding: 7bit
Content-Disposition: inline
_______________________________________________
XUL News Wire - http://xulnews.com
XUL Job Postings - http://xuljobs.com
Open XUL Alliance - http://xulalliance.org
_______________________________________________
xul-talk mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/xul-talk
--===============7949885434118068843==--