skeuocard Added ability to show both faces of the card at the same time.

Added ability to show both faces of the card at the same time.

Open cvrabie opened this issue 11 years ago • 4 comments

I'm currently working on a project where the user base is skewed toward people with very little experience with computers. After doing some user testing I discovered that the only negative comment about our payment section is that not everybody understands right away that they need to flip the card (even though there's a big red/green button that says so ... i know).

I also saw a few other people make similar comments in the issues section, and a few websites like pingdom which chose to go with a two-face visual card option.

So I've made this patch that allows you to disable the flip and show both faces at the same time. It seemed to be better received by our targeted customers. Skeuocard two-face.

The solution is completely CSS based. You can make it work by simply adding the two-face class on the skeuocard element. Alternatively you can also specify it in the initialization parameters like this

new Skeuocard($("#skeuocard"), {
  twoFace: true
});

Not sure if you're interested in merging such a feature in the main branch but here it is. Also, thank you very much for making Skeuocard available in the first place!