javascript - JQuery - Click, disable mouseover with reset -

i have tooltip popups away image. however, cannot seem clicking working concurrently hovering. i'd achieve have popup stay visible when user clicks image , disable when user clicks outside popup box, however, visible if user has hovers in image , hidden when user hovers out of image. i'm not quite sure how tackle this.

http://jsfiddle.net/bz4m7/

html

<div class="tooltip"> <div class="description"> here big fat description box</div> </div> 

css

.tooltip {     border: 1px #333 solid;     width:200px;     height:200px;     background-image:url('http://mathworld.wolfram.com/images/gifs/sqtripic.gif'); } .description {     display:none;     position:absolute;     border:1px solid #000;     width:400px;     height:400px;     left: 50%;     top: 50%     background: #000000; } 

js

$(".tooltip").mouseover(function() {     $(this).children(".description").show(); }).mouseout(function() {     $(this).children(".description").hide(); });  var isshown; $(".tooltip").mousedown(function() {     if (isshown == false){         $(this).children(".description").show();         isshown = true;     } }).mousedown(function() {     if (isshown == true){         $(this).children(".description").hide();         isshown = false;     } }); 

any appreciated! :) thanks!

after making following additions/changes css:

.tooltip {     position: relative; } .description {     left: 102%; } 

and following changes js/jquery:

$(".tooltip").mouseenter(function (e) {     $(this).children(".description").show(); }).mouseleave(function() {     if (isshown === false) {         $(this).children(".description").hide();     } else {         e.preventdefault();     } });  isshown = false; $(".tooltip").click(function (e) {     if (isshown === true) {         e.preventdefault();         $('.description').hide();         isshown = false;     } else {         $(this).children('.description').show();         isshown = true;     } }); 

i think accomplishes you're after, except hiding .description click outside of .tooltip. there isn't there click on @ moment.

here's fiddle: http://jsfiddle.net/bz4m7/1/