We help IT Professionals succeed at work.

jQuery Selector & Exclusion

jwzk
jwzk asked
on
Medium Priority
638 Views
Last Modified: 2012-05-07
I have the following codes, basically the alert should only fire if the user moves the cursor outside of the main box, it should never fire inside even when switching hover between div's inside the main box. That's why I tried :not(#main *), but that doesn't seem to work.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Test Page</title>
		<style>
			#body-content
			{
				margin:50px 0px; 
				padding: 0px;
				text-align: center;
			}
			
			#main {
				width:800px;
				height: 500px;
				margin:0px auto;
				text-align:left;
				padding:15px;
				border:1px dashed #333;
				background-color:#eee;
			}
			
			#navbar {
				background-color: #cc0000;
				margin-bottom: 250px;
			}
		</style>
		<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
		<script>
			$(document).ready(function(){		
				$("*:not(#main *)").mouseover(function(){
					alert("mouse out");
				}, function() {});
			});
		</script>
	</head>
 
	<body id="body-content">
		<div id="main">	
			<div id="navbar">
				Heres the navigation bar menu....
			</div>
			<div id="box">
				Heres some content in the box....
			</div>
		</div>
	</body>
</html>

Open in new window

Comment
Watch Question

Commented:
Unlock this solution and get a sample of our free trial.
(No credit card required)
UNLOCK SOLUTION

Author

Commented:
Wow, didn't know that existed. Mouseleave is exactly what I was looking for, thanks!

Author

Commented:
Exactly what I was looking to do
Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a sample view!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.