jqEasy - jQuery Sliding Info Panel Plugin

Usage

Add the following to your <head> tag:

            	<link href="jqeasypanel.css" rel="stylesheet" type="text/css" />
            	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
				<script type="text/javascript" src="jquery.jqEasyPanel.js"></script>
                <script type="text/javascript">
                $(document).ready(function() {
                	// default settings
                    $('#jqeasypanel').jqEasyPanel();
                });
                </script>

Add the panel and trigger divs right after the body tag:

				<div id="jqeasypanel">
                	<!-- panel content here -->
                </div>
                <div id="jqeasytrigger">
                    <a href="#" class="open">open</a>
                    <a href="#" class="close">close</a>
                </div>

Wrap your page content inside a container div (can be any id or class name):

                <div id="container">
                	<!-- your page content here -->
                </div>

Options

Here are all of jqEasyPanel's options and their default values:

                // these can all be overridden in your code
                position: 'top',			// panel position 'top' or 'bottom'
                height: '80px',				// set the height of the panel
                speed: 'normal',			// 'slow', 'normal', 'fast', or number in milliseconds
                moveContainer: true,		// whether to slide your page container along with the panel. this allows your page content to always be visible.
                container: '#container',	// your page container id or class
                openBtn: '.open',			// open button id or class inside 'jqeasytrigger' div
                closeBtn: '.close',			// close button id or class inside 'jqeasytrigger' div
                openLink: '.openpanel',		// open button id or class for text links to open panel
                closeLink: '.closepanel',	// close button id or class for text links to close panel
                keepOpenCheck: '#keepopen',	// sets cookie value to show panel on load on all pages
                showTrigger: true,			// turn trigger tab button on/off
                showOnLoad: false			// ALWAYS open panel on page load. Ignores cookie value!

Demo Download

If you find this resource useful, or if you use this code/plugin on your website, consider tossing a buck, or two, my way to help cover costs!

jQuery Sliding Info Panel Plugin - jqEasyPanel

Usage

Options