search

thecodemine / formwizard

jQuery plugin based on top of jQuery UI which turns a form into a multistep wizard. Integrates with the jQuery form plugin for AJAX submission of the form, the validation plugin for client side validation and the BBQ plugin for enabling the browsers back and forward buttons.
140 stars 54 forks source link

in/out animation breaks formatting in IE8 #29

Closed JasonGloverNZ closed 11 years ago

JasonGloverNZ commented 11 years ago

I've been tracking down an ilusive CSS issue in the site we are developing.

Symptom:

In IE8, everything inside the step container suffers two visual problems:

  1. Nothing stretches to fill the available space.
  2. ClearType text rendering is disabled.

    Cause:

The actual culprit seems to be jquery. In particular the easing. When the animation is complete there are fragments of CSS remaining in the style attribute of the step container.

style="zoom: 1; filter: ; display: inline"

If - using the F12 developer tools - I remove the empty filter value the problem goes away. It also goes away if I get rid of the zoom attribute.

But these are part of jquery and I don't necessarily want to get into hacking the jquery library. Are they known bugs? .... IDK!

What I want:

All my problem would go away if I could disable the animation of the form wizard.

thecodemine commented 11 years ago

Hi,

I have not heard of this issue before, and I'm sorry to say that I have no windows computer available for testing at the moment.

To disable the animation, could you try setting the inDuration and outDuration to 0 and see if that does the trick? If not, could you also try the following (which has been used by others to disable the animation):

inAnimation : { position: "absolute", visibility: "hidden", display: "block" }, outAnimation: { position: "absolute", visibility: "visible", display: "block" }, inDuration : 0, outDuration: 0

If this does not fix your issues, please send me a working example which displays the issue. Then I can install windows, debug the example and see if I can find a solution for you. Send the example to jan.sundman[ at ]aland.net

JasonGloverNZ commented 11 years ago

Thanks for the suggestions. I'll give them a go today.

No need to install Windows (yuck!). Save yourself some time and use http://www.browserstack.com/

Thanks again

Jason Glover 021 851173

On 7 November 2012 02:35, Jan Sundman notifications@github.com wrote:

Hi,

I have not heard of this issue before, and I'm sorry to say that I have no windows computer available for testing at the moment.

To disable the animation, could you try setting the inDuration and outDuration to 0 and see if that does the trick? If not, could you also try the following (which has been used by others to disable the animation):

inAnimation : { position: "absolute", visibility: "hidden", display: "block" }, outAnimation: { position: "absolute", visibility: "visible", display: "block" }, inDuration : 0, outDuration: 0

If this does not fix your issues, please send me a working example which displays the issue. Then I can install windows, debug the example and see if I can find a solution for you. Send the example to jan.sundman[ at ] aland.net

— Reply to this email directly or view it on GitHubhttps://github.com/thecodemine/formwizard/issues/29#issuecomment-10110620.