Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • jquery slideToggle method

    • 0
    • 1
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 220
    Comment on it

    In many site we have seen that when we click on some div,other div will slide down from it , this will happen with the help of  slideDown() method in jquery.

    If we want to make some div to slide up we can do that by using slideUp() method .

    SlideToggle method help us if we want to slideUp and slideDown some thing at the same time .

    Syntax

    $(div to be selected).slideToggle(speed,callback);

    speed :- This parameter contain a string which will contain predefined speeds i.e slow,normal or fast . It can also contain integer value of milliseconds.

    Below is the jquery code for using this method:-

    $(document).ready(function(){
        $("#slide").click(function(){
            $("#slide_part").slideToggle("slow");
        });
    });

    Below is the html code:-

    <html>
    <head></head>
    <title> home </title>
    <body>
    <div id="slide">When you click on me I will slide down</div>
    <div id="slide_part">Hiiiii!</div>
    </body>
    </html>

    Below is the css for above html code:-

    #slide_part, #slide {
        padding: 5px;
        text-align: center;
        background-color: #e5eecc;
        border: solid 1px #c3c3c3;
    }
    
    #slide_part {
        padding: 50px;
        display: none;
    }

     

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: