3D Interactive Popup Window With jQuery And CSS3 - 3D Popup

File Size: 4.29 KB
Views Total: 2930
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
3D Interactive Popup Window With jQuery And CSS3 - 3D Popup

A lightweight jQuery plugin for showing a CSS3 powered 3D popup window that interacts with mouse movement.

How to use it:

1. Add the latest version of jQuery library together with the jQuery 3D Popup plugin's JS and CSS files to the webpage.

<link rel="stylesheet" href="css/popup.css">
<script src="//code.jquery.com/jquery-latest.min.js"></script>
<script src="js/popup.js"></script>

2. Create the popup content following the markup structure displayed below:

<div class="popup">
  <div id="popup_name" class="popup_block">
    <div class="popup_head">
      <h2>Popup Title</h2>
    </div>
    <div class="popup_body">
      <p>Popup Content</p>
    </div>
  </div>
</div>

3. Create an trigger element to toggle the popup window.

<a id="tst" rel="popup_name" href="#">Click</a>

4. The JavaScript.

$("#tst").click(popup);

This awesome jQuery plugin is developed by lacrm. For more Advanced Usages, please check the demo page or visit the official website.