Safari unable to get width and height of image.

[rbjaanes]

Trying to use elem.height(); and elem.width().

Safari: 3.1.1
jQuery: 1.2.6

Element is set as draggable ... might have something to do with it.

[rbjaanes]

Seems as if Safari doesn't know the required info before the image is
done loading.
The functions work fine in debug console, and later events.

The image properties are NOT set in styles or anything.
That might be part of the issue, but I can't do more testing atm.

On May 28, 1:32 pm, rbjaanes <rolf.bjaa...@...> wrote:
> Trying to use elem.height(); and elem.width().
>
> Safari: 3.1.1
> jQuery: 1.2.6
>
> Element is set as draggable ... might have something to do with it.

[Ariel Flesler]

You're calling the methods inside a document.ready, right ?

--
Ariel Flesler
http://flesler.blogspot.com

On 28 mayo, 13:47, rbjaanes <rolf.bjaa...@...> wrote:

> Seems as if Safari doesn't know the required info before the image is
> done loading.
> The functions work fine in debug console, and later events.
>
> The image properties are NOT set in styles or anything.
> That might be part of the issue, but I can't do more testing atm.
>
> On May 28, 1:32 pm, rbjaanes <rolf.bjaa...@...> wrote:
>
>
>
> > Trying to use elem.height(); and elem.width().
>
> > Safari: 3.1.1
> > jQuery: 1.2.6
>
> > Element is set as draggable ... might have something to do with it.- Ocultar texto de la cita -
>
> - Mostrar texto de la cita -

[rbjaanes]

Yes. :)

On May 28, 7:19 pm, Ariel Flesler <afles...@...> wrote:

> You're calling the methods inside a document.ready, right ?
>
> --
> Ariel Fleslerhttp://flesler.blogspot.com
>
> On 28 mayo, 13:47, rbjaanes <rolf.bjaa...@...> wrote:
>
> > Seems as if Safari doesn't know the required info before the image is
> > done loading.
> > The functions work fine in debug console, and later events.
>
> > The image properties are NOT set in styles or anything.
> > That might be part of the issue, but I can't do more testing atm.
>
> > On May 28, 1:32 pm, rbjaanes <rolf.bjaa...@...> wrote:
>
> > > Trying to use elem.height(); and elem.width().
>
> > > Safari: 3.1.1
> > > jQuery: 1.2.6
>
> > > Element is set as draggable ... might have something to do with it.- Ocultar texto de la cita -
>
> > - Mostrar texto de la cita -

[thetoine]

I'm having the same issue, anyone found a fix for that?

Adding a timer on top of (document).Ready() doesn't seem to work
either.

This code work just fine in Firefox, in Safari it's different at every
reload :

<code>
el = $('#projects div ul li');
width = $(el[el.length - 1]).width();
var _timer = setInterval(function() {
        if (width != 0) {
    clearInterval(_timer);
                projects.init();
  }
}, 10);
</code>

On May 29, 9:59 am, rbjaanes <rolf.bjaa...@...> wrote:

> Yes. :)
>
> On May 28, 7:19 pm, Ariel Flesler <afles...@...> wrote:
>
> > You're calling the methods inside a document.ready, right ?
>
> > --
> > Ariel Fleslerhttp://flesler.blogspot.com
>
> > On 28 mayo, 13:47, rbjaanes <rolf.bjaa...@...> wrote:
>
> > > Seems as ifSafaridoesn't know the required info before the image is
> > > done loading.
> > > The functions work fine in debug console, and later events.
>
> > > The image properties are NOT set in styles or anything.
> > > That might be part of the issue, but I can't do more testing atm.
>
> > > On May 28, 1:32 pm, rbjaanes <rolf.bjaa...@...> wrote:
>
> > > > Trying to use elem.height(); and elem.width().
>
> > > >Safari: 3.1.1
> > > > jQuery: 1.2.6
>
> > > > Element is set as draggable ... might have something to do with it.- Ocultar texto de la cita -
>
> > > - Mostrar texto de la cita -

[Ariel Flesler]

If you don't set the dimensions inline, then you need to wait for the
load event of the image.
You can use jQuery.Preload to ease on this part.
  http://flesler.blogspot.com/2008/01/jquerypreload.html

--
Ariel Flesler
http://flesler.blogspot.com

On 24 jul, 19:53, thetoine <antoine.gir...@...> wrote:

> I'm having the same issue, anyone found a fix for that?
>
> Adding a timer on top of (document).Ready() doesn't seem to work
> either.
>
> This code work just fine in Firefox, in Safari it's different at every
> reload :
>
> <code>
> el = $('#projects div ul li');
> width = $(el[el.length - 1]).width();
> var _timer = setInterval(function() {
>         if (width != 0) {
>     clearInterval(_timer);
>                 projects.init();
>   }}, 10);
>
> </code>
>
> On May 29, 9:59 am, rbjaanes <rolf.bjaa...@...> wrote:
>
>
>
> > Yes. :)
>
> > On May 28, 7:19 pm, Ariel Flesler <afles...@...> wrote:
>
> > > You're calling the methods inside a document.ready, right ?
>
> > > --
> > > Ariel Fleslerhttp://flesler.blogspot.com
>
> > > On 28 mayo, 13:47, rbjaanes <rolf.bjaa...@...> wrote:
>
> > > > Seems as ifSafaridoesn't know the required info before the image is
> > > > done loading.
> > > > The functions work fine in debug console, and later events.
>
> > > > The image properties are NOT set in styles or anything.
> > > > That might be part of the issue, but I can't do more testing atm.
>
> > > > On May 28, 1:32 pm, rbjaanes <rolf.bjaa...@...> wrote:
>
> > > > > Trying to use elem.height(); and elem.width().
>
> > > > >Safari: 3.1.1
> > > > > jQuery: 1.2.6
>
> > > > > Element is set as draggable ... might have something to do with it.- Ocultar texto de la cita -
>
> > > > - Mostrar texto de la cita -- Ocultar texto de la cita -
>
> - Mostrar texto de la cita -

[Ariel Flesler]

Oh.. and your code is wrong :)

var _timer = setInterval(function() {
  var width = $('#projects div ul li').slice(-1).width();
   if (width != 0) {
      clearInterval(_timer);
      projects.init();
  }
}, 10);

No need to mention that polling sucks on perfomance.

--
Ariel Flesler
http://flesler.blogspot.com

On 24 jul, 19:53, thetoine <antoine.gir...@...> wrote:

> I'm having the same issue, anyone found a fix for that?
>
> Adding a timer on top of (document).Ready() doesn't seem to work
> either.
>
> This code work just fine in Firefox, in Safari it's different at every
> reload :
>
> <code>
> el = $('#projects div ul li');
> width = $(el[el.length - 1]).width();
> var _timer = setInterval(function() {
>         if (width != 0) {
>     clearInterval(_timer);
>                 projects.init();
>   }}, 10);
>
> </code>
>
> On May 29, 9:59 am, rbjaanes <rolf.bjaa...@...> wrote:
>
>
>
> > Yes. :)
>
> > On May 28, 7:19 pm, Ariel Flesler <afles...@...> wrote:
>
> > > You're calling the methods inside a document.ready, right ?
>
> > > --
> > > Ariel Fleslerhttp://flesler.blogspot.com
>
> > > On 28 mayo, 13:47, rbjaanes <rolf.bjaa...@...> wrote:
>
> > > > Seems as ifSafaridoesn't know the required info before the image is
> > > > done loading.
> > > > The functions work fine in debug console, and later events.
>
> > > > The image properties are NOT set in styles or anything.
> > > > That might be part of the issue, but I can't do more testing atm.
>
> > > > On May 28, 1:32 pm, rbjaanes <rolf.bjaa...@...> wrote:
>
> > > > > Trying to use elem.height(); and elem.width().
>
> > > > >Safari: 3.1.1
> > > > > jQuery: 1.2.6
>
> > > > > Element is set as draggable ... might have something to do with it.- Ocultar texto de la cita -
>
> > > > - Mostrar texto de la cita -- Ocultar texto de la cita -
>
> - Mostrar texto de la cita -

[thetoine]

Hi,

I found a fix for this Safari behavior, ugly but it works. Just add a
timer on top of document.ready function. Feel free to use a native js
timer, I was just lazy ;)

<code>
$(document).ready(
        function() {
                timer = 0;
                var _timer = setInterval(function() {
                        timer++;
          if (timer == 50) {
              clearInterval(_timer);
                                init_call();
            }
          }, 10);
        }
);
</code>

On May 29, 9:59 am, rbjaanes <rolf.bjaa...@...> wrote:

> Yes. :)
>
> On May 28, 7:19 pm, Ariel Flesler <afles...@...> wrote:
>
> > You're calling the methods inside a document.ready, right ?
>
> > --
> > Ariel Fleslerhttp://flesler.blogspot.com
>
> > On 28 mayo, 13:47, rbjaanes <rolf.bjaa...@...> wrote:
>
> > > Seems as ifSafaridoesn't know the required info before the image is
> > > done loading.
> > > The functions work fine in debug console, and later events.
>
> > > The image properties are NOT set in styles or anything.
> > > That might be part of the issue, but I can't do more testing atm.
>
> > > On May 28, 1:32 pm, rbjaanes <rolf.bjaa...@...> wrote:
>
> > > > Trying to use elem.height(); and elem.width().
>
> > > >Safari: 3.1.1
> > > > jQuery: 1.2.6
>
> > > > Element is set as draggable ... might have something to do with it.- Ocultar texto de la cita -
>
> > > - Mostrar texto de la cita -

[Brandon Aaron]

Make sure you have included the width and height attributes on the image tag itself.

--
Brandon Aaron

On Wed, May 28, 2008 at 11:47 AM, rbjaanes <rolf.bjaanes@...> wrote:

Seems as if Safari doesn't know the required info before the image is
done loading.
The functions work fine in debug console, and later events.

The image properties are NOT set in styles or anything.
That might be part of the issue, but I can't do more testing atm.

On May 28, 1:32 pm, rbjaanes <rolf.bjaa...@...> wrote:
> Trying to use elem.height(); and elem.width().
>
> Safari: 3.1.1
> jQuery: 1.2.6
>
> Element is set as draggable ... might have something to do with it.

[Kelly Hallman]

Have you tried to use jQuery(window).load()
instead of jQuery(document).ready() ?

I am working on deveoping a plugin that works on the height/width of an
image loaded in the HTML. I had to use window/load instead of
document/ready, for Safari to work. This is a common resolution when you
have these timing problems especially re: other inline content like an
image that may not be finished loading by the time the DOM is ready.



thetoine wrote:

> I'm having the same issue, anyone found a fix for that?
>
> Adding a timer on top of (document).Ready() doesn't seem to work
> either.
>
> This code work just fine in Firefox, in Safari it's different at every
> reload :
>
> <code>
> el = $('#projects div ul li');
> width = $(el[el.length - 1]).width();
> var _timer = setInterval(function() {
> if (width != 0) {
>     clearInterval(_timer);
> projects.init();
>   }
> }, 10);
> </code>
>
> On May 29, 9:59 am, rbjaanes <rolf.bjaa...@...> wrote:
>  
>> Yes. :)
>>
>> On May 28, 7:19 pm, Ariel Flesler <afles...@...> wrote:
>>
>>    
>>> You're calling the methods inside a document.ready, right ?--
>>> Ariel Fleslerhttp://flesler.blogspot.com
>>> On 28 mayo, 13:47, rbjaanes <rolf.bjaa...@...> wrote:
>>>
>>> Seems as ifSafaridoesn't know the required info before the image is
>>> done loading.
>>> The functions work fine in debug console, and later events.
>>>
>>> The image properties are NOT set in styles or anything.
>>> That might be part of the issue, but I can't do more testing atm.
>>>
>>> On May 28, 1:32 pm, rbjaanes <rolf.bjaa...@...> wrote:
>>> Trying to use elem.height(); and elem.width().
>>> Safari: 3.1.1
>>> jQuery: 1.2.6
>>>
>>> Element is set as draggable ... might have something to do with it.- Ocultar texto de la cita -
>>>      

[serhio]

Thanks, man, you saved my day, have been looking for a solution all night

Kelly Hallman wrote:

Have you tried to use jQuery(window).load()
instead of jQuery(document).ready() ?
....