Javascript If click outside layer

Posted on 2007-11-14
Last Modified: 2008-02-01
Hi Experts

I have a div layer that appears onclick.

My question is that to hide the layer I have a X with a onclick style.display='none'

How can i make it so that if I click anywhere on the screen that is not in the layer, the layer hides?

Question by:nikdonovanau
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
  • 2
LVL 75

Expert Comment

by:Michel Plungjan
ID: 20278515
LVL 75

Accepted Solution

Michel Plungjan earned 500 total points
ID: 20278540
So with a few changes to the code  from the link

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "">
<title>Untitled Document</title>
<style type="text/css">
    background-color: #999999;
    height: 100px;
    width: 100px;
    border:1px solid black
<script type="text/javascript">
function check(e){
  var target = (e && || (event && event.srcElement);
  var obj = document.getElementById('mydiv');
  var obj2 = document.getElementById('sho');
  var parent = checkParent(target);
function checkParent(t){
      return false
  return true
<a href="#" id="sho">show the div</a>
<div id="mydiv">
<div style="float:right"><a href="#" onClick="document.getElementById('mydiv').style.display='none';return false">[X]</div>

Author Comment

ID: 20278636
Thanks for that :)

Featured Post

Revamp Your Training Process

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
dynamic created check uncheck boxes 6 43
Accordion won't close correctly 5 14
how to customize the text in the legend in highcharts 3 36
Hide and Unhide Table 6 27
This article shows how to create and access 2-dimensional arrays in JavaScript.  It includes a tutorial in case you are just trying to "get your head wrapped around" the concept and we'll also look at some useful tips for more advanced programmers. …
In my daily work (mainly using, I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
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…

696 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