Submit your widget

jQuery Slideshow Tip Cards

Created 4 years ago   Views 21336   downloads 5615    Author peachananr
jQuery Slideshow Tip Cards
View DemoDownload 15.5 KB
43
Share |

This is  an animated card layout.

Modern browsers such as Chrome, Firefox, and Safari on desktop have been tested. I have not tested this on IE.

Tip Cards plugin let you create a layout of cards with a card-like interaction that you see on Google Tips Page. I've also added several new animation options so that you can personalize it to your own liking.

To add this to your website, all you have to do is include the latest jQuery library together withjquery.tip_cards.js and tip_cards.css into your document's <head>, and follow the HTML markup as shown below.

This is the default markup if you are looking to replicate the effect you see on Google Tips Page.

<body>
  ..
  <ul class="tips">
    <li>
      <div class="tc_front">
        <a href="#tip1">...</a>
      </div>
      <div class="tc_back">...</div>
      <div id="tip1" class="tip">
        <div class="tc_front">...</div>
        <div class="tc_back">...</div>
      </div>
    </li>
  ..
</body>

Read more:https://github.com/peachananr/tip_cards