DROP DOWN DIV

[erik216]

I need to make a web component
There have a link to control show / hide a div
When user mouseover the link. The div will drop down. When mouse out of the div. The div will hide.

Where can I find this script?
Thanks~

[JorgeM]

You can easily do this with jquery. Documentation at jquery.com. If you have some code written and need help polishing it, post your code.

[lambing]

I'm not sure why would you want to use JavaScript for making a dropdown. You can use css for this one. But here's what you need if you need a script.

This is a sample markup:

<div id="link-wrapper">
    <a href="#" id="link">Hover to show div</a>
    <div class="hide" id="some-div">
        <ul>
            <li>
                <a href="#">link1</a>
            </li>    
            <li>
                <a href="#">link2</a>
            </li>    
        </ul>
    </div>
</div>​



.hide {
    display: none;
}

#some-div {
    margin-top: 50px;
    background-color: #ccc;
}

#link-wrapper {
    width: 150px;
}
​

The sample script

$('#link-wrapper').mouseover(function() {
    $('#some-div').show();
}).mouseout(function() {
    $('#some-div').hide();
});

​