Jquery/CSS help needed to make fallback for IE and older browsers

Posted by matt_50 on Stack Overflow See other posts from Stack Overflow or by matt_50
Published on 2012-06-23T11:34:20Z Indexed on 2012/06/25 9:16 UTC
Read the original article Hit count: 180

Filed under:
|

Wondering if any of you can help me:

I've made a signup modal that uses a CSS transform to switch between two methods of signing up. I've decided to try a 'card flip' type effect.

  1. Have a look at this JSfiddle in any browser that supports CSS 3D transforms - click the 'old fashioned way' text to 'flip' the modal (simplified for demo purposes): http://jsfiddle.net/voodoo6/cnTMz/8/
  2. Then take a look in IE8/9 - as the 'back' is taller than the front and IE does;t support 'backface-visibility: hidden;' the reverse can be seen below the front.

I've been trying to use JQuery and conditional CSS to 'display:none' the 'back' on load in IE (and older browsers), then add a 'display:block;' class to show it on click, problem is, I'm a JQuery beginner and have been struggling to get it to work! Not even sure if this is the best approach? Can anybody suggest an approach that would get this working in less-capable browsers?

Thanks for any advice..

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about css