You probably need to wrap your code in $(function(){/* code */}):
$(function(){
$("#categories li").hover(function(){
alert("the mouse is over");
},function(){
alert("the mouse is out");
});
});
The code you posted immediately attempts to bind the events as its
interpreted, at which time the DOM elements do not exist and thus no events
are bound. Using $(function(){}), which is a shortcut for
$(document).ready(function(){/* code */}), it is run once the DOM is loaded.
HTH!
On 4/29/07, Ralph <[EMAIL PROTECTED]> wrote:
I'm tryin to do a hover effect for a using a unordered list....this is
what my code looks like:
<script>
$("#categories > li").hover(function(){
alert("the mouse is over");
},function(){
alert("the mouse is out");
});
</script>
<div id="categories">
<ul>
<li>Category 1</li>
<li>Category 2</li>
<li>Category 3</li>
<li>Category 4</li>
<li>Category 5</li>
</ul>
</div>
i've tried different variations for selecting the element including
$("#categories > ul > li"), but nothing is happening. I'm sure i'm
overlooking something....
