CSS 3d // cards 3D // click hover events // flip cards 3D // flip cards Wordpress // flipping cards // multiple effects // rotation 3D // wordpress //
| Created | 28 February 13 |
| Last Update | 22 May 13 |
| Compatible Browsers | Firefox, Safari, Chrome |
| Software Version | WordPress 3.5 |
| Files Included | JavaScript JS, HTML, CSS, PHP |
More Info...Flipping Cards 3D Wordpress
Flipping Cards 3D – Wordpress
- Colection of Flips and Effects of cards using CSS 3D and jQuery.
- Easy to implement with your Wordpress.
- Works in all modern browsers (Google Chrome, Safari, Firefox).
- IE fallback of fade effect.
----> Update: May 21, 2013
Fixed some sticking issues in firefox for the over flipping cards
----> BIG Update: May 8, 2013
Auto Flip Effect is now available, you can set the time until a card will flip
automatically, also you can set the time when the card will start
doing the autoflips. (you can see it in the live preview)
NOTE: when you do a mouseover on an auto flipping card it will not flip as long
as you have the mouse over the card
----> Update: April 28, 2013
Now is compatible with jQuery 1.9.1
----> Update: April 10, 2013
Fixed some IE issues
----> Update: March 20, 2013
Add also a fallback of a fade effect for browsers that not support CSS3D like old versions of Chrome and Firefox.
----> Update: Feb 28, 2013
Add a feature that allow you to add third-party shortcodes inside the flipping card
Add a Flipping card to your posts or pages with this shortcode:
[flippingCard]
[fc_front]
HERE GOES THE HTML FOR THE FRONT PART OF THE FLIPPING CARD
[/fc_front]
[fc_back]
HERE GOES THE HTML FOR THE BACK PART OF THE FLIPPING CARD
[/fc_back]
[/flippingCard]
Note: If you would like to know how I configure the admin page and customize the flipping cards in the live preview, contact me via email and I will show you all I did.
You can edit a single Flipping Card by passing parameters, these are all the parameters available:
[flippingCard direction="right" type="over" float="left" margin="0 10px 10px 0"
width="300px" height="300px" border="1px solid gray" borderRadius="10px"
background="white" padding="20px" textalign="center"]
Related produck
No comments:
Post a Comment