# Jquery show hide problem

**URL:** <https://forum.kirupa.com/t/jquery-show-hide-problem/326243>\
**Category:** Uncategorized\
**Created:** [December 1, 2011, 3:17pm UTC](https://forum.kirupa.com/t/jquery-show-hide-problem/326243 "2011-12-01T15:17:04Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![m2244](https://avatars.discourse-cdn.com/v4/letter/m/ac91a4/32.png) [@m2244](https://forum.kirupa.com/u/m2244)\
**Post date:** [December 1, 2011, 3:17pm UTC](https://forum.kirupa.com/t/jquery-show-hide-problem/326243/1 "2011-12-01T15:17:04Z")

</div>

Hello,

I am having a problem when I hide a draggable div. The div is still there and you can not interact with anything on the page because the draggable div is still covering it up. I need to be careful moving it around because JS uses its location.

What did I do wrong?

The HTML

```auto

	<div id="boxPup" style="left:225px;top:75px;"><!--These in-line styles are needed for the dragStart JS function to get the initial location of the draggable div.-->
		<div class="bar" onmousedown="dragStart(event, 'boxPup')">Drag Box B</div>
		<div id="popUpDiv">
			<!-- The SWF is embedded here with showHidePup() using the div ID. -->
		</div>
	</div>

```

The JS

```auto

/* This function is called from the popup SWF on x-out */
function hidePup()
{
	$('#boxPup').hide();
}

/* This is the function that is called by the popup links. This displays the popup div and passes 2 variables to the SWF (pupUrl, pupTitle). */	
function showHidePup(pupUrl, pupTitle)
{
	$('#boxPup').show();
	var flashvars = {pUrl:pupUrl, popTitle: pupTitle};
	var params = {wmode:"transparent"};
	params.quality = "high";
	var attributes = {};
	swfobject.embedSWF("pop_up.swf", "popUpDiv", "700", "520", "9.0.0", false, flashvars, params);//, attributes
}

```