Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

another stab at fixing animate() for elements just added to DOM #586

Closed
wants to merge 3 commits into from

Conversation

mislav
Copy link
Collaborator

@mislav mislav commented Sep 11, 2012

@madrobby, I want you to take a look at this.

Activating CSS transitions for an element just added to the DOM won't work in either Webkit or Mozilla. To work around this, we used to defer setting CSS properties with setTimeout (see 272513b).

This solved the problem for Webkit, but not for latest versions of Firefox. Mozilla seems to need at least 15ms timeout, and even this value varies.

A better solution for both engines is to trigger "layout". This is done here by reading clientLeft from an element.

With 2-column layout, now fits on iPhone screen
Activating CSS transitions for an element just added to the DOM won't
work in either Webkit or Mozilla. To work around this, we used to defer
setting CSS properties with setTimeout (see 272513b).

This solved the problem for Webkit, but not for latest versions of
Firefox. Mozilla seems to need at least 15ms timeout, and even this
value varies.

A better solution for both engines is to trigger "layout". This is done
here by reading `clientLeft` from an element. There are other
properties and methods that trigger layout; see
http://gent.ilcore.com/2011/03/how-not-to-trigger-layout-in-webkit.html
animate() is not async anymore
@madrobby
Copy link
Owner

As discussed in zepto-core, this looks like a better solution.

@mislav
Copy link
Collaborator Author

mislav commented Sep 11, 2012

Merged as 2ed0123

@mislav mislav closed this Sep 11, 2012
@AliMD
Copy link

AliMD commented Sep 11, 2012

Where defined that ? and why it work !?

@mislav
Copy link
Collaborator Author

mislav commented Sep 12, 2012

that is a local variable. if you search for it in your text editor, you'll see where it's defined. It stores the original reference to this inside nested functions that execute in different scopes

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants