Logic for hovering in jQuery dependent on where mouse hovers -

i'm trying figure out how write in jquery conditional statement on user hovers mouse.

i've got logic hover function. when user hovers on list item "z", element (a div class "box") on page performs function (namely animates). on hover "out" part of equation (hovering out of list item "z"), need write conditional statement along these lines:

• when hovering out of list item "z", if user moves mouse on div ".box", run function a
• if user not move mouse on div ".box", run function b

hopefully that's clear enough. i'm trying determine user hovers next , perform function accordingly.

if have html this:

<ul id="somelist">     <li>some list item 1</li>     <li>some list item 1</li>     <li>some list item 1</li> </ul> 

you can achieve desired functionality this:

$("ul#somelist > li").mouseover(function(){     // next line set background of hovered element red     $(this).css({background: "red"}); }).mouseout(function(){     // next line set background of list element green when mouse out     $(this).css({background: "green"}); }); 

edit: think bit easier understand

var mouseoverhandler = function() {      var styleobject = {         background: "red"     };      $(this).css(styleobject); }  $("ul#somelist > li").mouseover(mouseoverhandler);