The best place to find jQuery plugins !

Welcome on myjqueryplugins,

the best jquery plugins library !

Add your jQuery plugin.

Connect it with GitHub and create your plugin Homepage.

Make known your plugin to the community or link it to your own website !

Slide box : Practical plugin to hide an element of secondary function on a web site

Plugin rate :

Here is a quite easy to use practical plugin to hide an element of secondary function on a web site or a forum (chatbox, secondary commands, etc.).
You will just have to target an element thanks to the main function of the plugin to admit it to a sliding side box.

This type of tool is very simple to set up because it is a plugin of the jQuery library. It's also very light (0,88 Ko) and can be reduced thanks to the Gzip compression in approximately 0,48 ko.

Implementation: 

1. First, include CSS & jQuery files

1
2
3
4
5
6
<!-- CSS files -->
<link href="juizSlideBox.css" rel="stylesheet" type="text/css" media="screen, projection" />
 
<!-- Js Files -->
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="juizSlideBox.min.js"></script>

 

2. HTML code

1
2
3
4
<div id="aside">
  <p>The content of the SlideBox<br />
  <a href="#juiz_box" id="testme">Click to test</a></p>
</div>

 

3. Call the plugin

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script type="text/javascript">
        $(document).ready(function() {
                /* simple call */
                $(document).ready(function() {
                    $("#aside").juizSlideBox();
                });
              
                /* more complex call*/
                $("#aside").juizSlideBox({
                    'boxOpacity'    :       "0.9",
                    'boxSpeed'      :       "400"
                });
        });
</script>
Options: 
boxPositionX
String
Default : left - Horizontal position of the SlideBox. Can be set to "left" or "right"
boxOpacity
Float
Default : 1 - Opacity of the SlideBox. Between 0 & 1
boxSpeed
Integer
Default : 500 - In ms, duration of the animation of the slidebox. Can be set to "slow" or "fast".
thanks
String
Default : yes - Discreet backlink towards the web site author. Can be set to "yes" or "no"
Screenshots
  • SlideBox is open

Comments

My family every time say that I am killing my time
here at web, except I know I am getting know-how daily
by reading thes nice content.

all tell us we spending the gold time on the web .. me too

Add new comment

To prevent automated spam submissions leave this field empty.

Plain text

  • Lines and paragraphs break automatically.
  • Allowed HTML tags: <p> <br> <br />

Informations

jQuery
>= 1.3
Current version
1.3
Browsers compatibility
Google ChromeIE 7IE 8IE 9Mozilla FirefoxOperaSafari
Comments [2]