Skip to main content

Bug Tracker

Side navigation

#3312 closed bug (duplicate)

Opened September 01, 2008 06:53AM UTC

Closed April 22, 2009 02:41AM UTC

dimension methods not working on document.ready on safari

Reported by: tipiirai Owned by: brandon
Priority: major Milestone: 1.3
Component: event Version: 1.2.6
Keywords: Cc: tipiirai, flesler
Blocked by: Blocking:

I tried with element.outerWidth() and it always returns the full window width when on document.ready. However after one millisecond after loading the width is correct.

Attachments (1)
  • (18.0 KB) - added by andrewharrison October 27, 2008 06:31PM UTC.

    test case for safari document ready issue

Change History (7)

Changed September 01, 2008 12:57PM UTC by flesler comment:1

cc: → tipiirai, flesler
need: ReviewTest Case

Your details are not quite enough to be able to handle this.

Could you provide a test case ? a minimalistic html file with the requires html and js to reproduce the problem.


Changed October 21, 2008 02:37PM UTC by anderhagen comment:2

I discovered the same behaviour, and did some testing. When I defined the styles in the head of the HTML-doc (instead of linking to a CSS-file) it worked fine... It seams that the document.ready event maybe doesn't wait for external CSS files to load before firing (In Safari at least)...?

The CSS file just contained 10 lines of code, and I run it on a local server, so response/download times shouldn't be an issue.

Safari 3.1.2, Win XP

Changed October 27, 2008 06:47PM UTC by andrewharris comment:3

I concur with the previous message. This is quite tricky to replicate. When I run a test from the file system, it works ok. When I run it from a server running on localhost, it fails. When the css is included it works ok, when the css file is referenced, it fails. I've attached a simple test case which includes a separate css file, and commented out inline css. It also has a timeout() commented out on the function that invokes the dimensions. On my local machine, 10 ms works, but less doesn't.

the more complicated real problem I'm having returns variations of results, not just the window dimensions, i.e. some of the values (padding, border, margin etc) are correct and some are not.

If memory serves me, the callbacks from WebKit are a little unreliable.:-(

I'm running Safari 3.1.2 on Mac OS X 5.5 (Leopard). Hope this helps.

Changed October 27, 2008 08:17PM UTC by flesler comment:4

component: coredimensions
need: Test CasePatch
owner: → brandon

Changed February 16, 2009 05:58PM UTC by tipiirai comment:5

Now I got a more clear description of the bug and a demo page.

The problem is that in Safari $(document).ready() is fired too early. There is no way to access CSS properties when using external stylesheets. Here is a demo

in Firefox (for example) css() method gives correct result (300px) but not in Mac/Safari.

I have experienced this on 1.2.6 too and on many different scenarios. I think this is quite serious because when components rely on initial CSS properties Safari won't work. $(window).load() fixes the situation.

Changed February 16, 2009 06:17PM UTC by tipiirai comment:6

forgot to mention that the problem is also fixed when styles are defined on the page and not in external stylesheet.

Changed April 22, 2009 02:41AM UTC by brandon comment:7

component: dimensionsevent
resolution: → duplicate
status: newclosed

Marking as dup of #4187