This time I will share jQuery Plugin and tutorial about Easy Slide-in Panel In jQuery – Pull Out Banner, hope it will help you in programming stack.
The Pull Out Banner is a small jQuery script used to create a drawer-style slide-in box that stays in the lower right hand corner of the screen.
It provides a quick way to show Ads, notifications, social profiles, big sales, feedback forms, and any other call to action information on your landing pages or web applications.
How to use it:
1. Load the stylesheet js-pull-out-banner.css for the pull out banner.
1 |
<link rel="stylesheet" href="/path/to/css/js-pull-out-banner.css" /> |
2. Insert any content to the pull out banner.
02 |
<div class="pobanner"> |
03 |
<div class="pobanner-header"> |
04 |
<button class="btn-pobanner"> |
08 |
<div class="pobanner-body"> |
10 |
<a href="#" title="..." style="display: block;"> |
11 |
<img src="../img/sample-banner.png" alt="..." width="100%"> |
3. Load the JavaScript js-pull-out-banner.js after loading the latest jQuery library. That’s it.
1 |
<script src="/path/to/cdn/jquery.min.js"></script> |
2 |
<script src="/path/to/js/js-pull-out-banner.js"></script> |
This awesome jQuery plugin is developed by sixness. For more Advanced Usages, please check the demo page or visit the official website.
