Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

onMouseOut change div to visibility:hidden

Posted on 2004-03-22
6
Medium Priority
?
2,657 Views
Last Modified: 2008-03-03
I have a list - onmouseout of the <ul> I want it to hide a div on the page.  Any suggestions?

Thanks,
Hayden
0
Comment
Question by:Quarfelburg
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
6 Comments
 
LVL 3

Expert Comment

by:xp_commander
ID: 10653110
<script type="text/javascript">

function showIt() {
document.frm.text.style.visibility="visible"; //set to visible
}
function hideIt() {
document.frm.text.style.visibility="hidden"; //set to hidden
}
</script>

call this on your onmouseout event such as :-

<UL>
<LI><A HREF="order.html"
    onMouseOver="describe('Order a product'); return true;"
    onMouseOut="hideIt()">
Order Form</A>
<LI><A HREF="email.html"
    onMouseOver="describe('Send us a message'); return true;"
    onMouseOut="hideIt();">
Email</A>
</UL>


Alternatively, you can use
document.frm.text.style.display="none"; // hide
AND
document.frm.text.style.display="block"; // show
As this above code will not only makes it invisible but removes it from the page, so it does not takes up any space
0
 

Author Comment

by:Quarfelburg
ID: 10653150
Perhaps I wasn't clear - I have a div absolutely positioned on a page and want an onmouseout to change the css on my style sheet to visiblity:hidden


0
 
LVL 3

Expert Comment

by:xp_commander
ID: 10653179
Sorry , forgot to mention above code was two snapshot from one of my apps , you would need to use
document.getElementById to get the pointer to your div tag , i.e :-

So the pseudo code would look like :-

In your list   : onMouseOut="hideIt(div id);"

In hide function :- function hideIt(Pass the div Object here) {
document.getElementById(div id).style.visibility="hidden"; //set to hidden
}
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 

Author Comment

by:Quarfelburg
ID: 10653358
what do you mean by "Pass the div Object here"?

Pardon my ignorance.
0
 
LVL 3

Accepted Solution

by:
btech1 earned 500 total points
ID: 10653649
<html>
<head<script type="text/javascript">
function hideIt() {
     document.getElementById("me").style.visibility="hidden";
}
</script>
</head>
<body>
<div id="me">
  Seeing me?
</div>
<ul>
  <li><a href onmouseout="hideIt();">Hide it</a>
</ul>
</body>
</html>
0
 

Author Comment

by:Quarfelburg
ID: 10653718
Sorry meant to put assist on xp_commander

Anyway to change that?

Thanks guys,
Hayden
0

Featured Post

Hire Technology Freelancers with Gigs

Work with freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely, and get projects done right.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

609 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question