http://careergrooming.org/

hide and show

by Thulasi Ram.S

HTML

<ul>
    <li class="widget" id="liOurService">
        <br />
        <br />
        <h1>Our Services</h1>
        <br />
        -----------------------------------------
        <ul>
            <li>
                <a href="CGplacementt.aspx">
                    <h3>> Placement</h3>
                </a>
            </li>
            <li>
                <a href="CGSpokenEnglish.aspx">
                    <h3>> Spocken English</h3>
                </a>
            </li>
            <li>
                <a href="CGITTraining.aspx">
                    <h3>> IT Training</h3>
                </a>
            </li>
            <li>
                <a href="index.html">
                    <h3>> Software Services</h3>
                </a>
            </li>
            <li>
                <a onclick="career1()" href="CGCareer.aspx">
                    <h3>> Career</h3>
                </a>
            </li>
        </ul>
    </li>
</ul>

CSS

#liOurService ul
{
    background:#80BFFF
}

#liOurService ul a
{
    color:white;
}

JavaScript

$(document).ready(function () {   
        $('#liOurService').find('ul').hide();

        $('#liOurService').live({
            mouseenter: function () {
                $(this).find('ul').slideDown('fast');
            },
            mouseleave: function () {
                $(this).find('ul').slideUp('fast');
            }
        });      
    });