Retro Looking Text Flip Effect with jQuery and CSS3 - bFlipText
File Size: | 5.33 KB |
---|---|
Views Total: | 4924 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
bFlipText is a jQuery plugin which utilizes CSS3 magic to create retro looking flip effect on given text like the split flap display.
See also:
How to use it:
1. Load jQuery library and the jQuery bFlipText plugin's stylesheet & JavaScript into the webpage.
<link rel="stylesheet" href="jquery.bFlipText.css"> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script src="jquery.bFlipText.js"></script>
2. Create an empty for the split flap display.
<div id="demo"></div>
3. Call the plugin on the empty container and specify the text on where you wish to apply the flip effect.
$('#demo').bFlipText({text: 'Text Here'});
4. Style the split flap display.
var my_style = {// CUSTOM STYLES HERE}; $('#demo').bFlipText({text: 'Text Here',css: my_style});
This awesome jQuery plugin is developed by bilalhdh. For more Advanced Usages, please check the demo page or visit the official website.