“SlideBox” jQuery Slider

Ein einfaches Script, mit Hilfe von dem erreicht.

JavaScript

In dieser .js Dateien geben Sie in dem Script Tag das src-Attribut, um ein Query Framework einzufügen.

<script type="text/javascript" src="js/jquery-1.4.2.min.js" ></script>

Das Initialisierungsskript setzen wir in den

<script type="text/javascript">
    $(function()
        {
        $("#link").click(function(event) {
        event.preventDefault();
        $(this).toggleClass("link2");
        $("#dropdown_box").slideToggle();
        });
    });
</script>

.header-banner-right ist die Klasse, die die Höhe der Box in der versteckten Position festlegt.
#link ist ein Button-Element mit einem Bild, das den Inhalt versteckt.
#dropdown_box Diese ID ist der Content-Bereich der Box

HTML

Unten steht es die allgemeine Darstellung vom HTML-Script:

CSS

#link {
background:url(images/button_go_box.png) no-repeat 0 0;
display:block;
height:39px;
width:39px;
z-index:180000;
margin:0 0 0 471px;
position:absolute;
}

.dropdown_box {
z-index:1;
}

.dropdown_box {
    zoom:0;
    z-index:1;
}
.all .dropdown_box {
    zoom:0;
    z-index:1;
}