Jump to content

jquery dropdown help


Recommended Posts

Im no javascript expert & im new to jquery so i need some help. I realize that this probably isn't the most efficient way to do this, but its workin for now & im not sure how to do it better yet..

 

I created a dropdown tab thing that drops on mouse over and is supposed to go back up on mouse out. but it just goes up immediately. I can't figure out why???? here is the js.

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jqueryui.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#left_drop_down').hover(function(){
	showContent('left_drop_down'), hideContent('left_drop_down');
});

$('#right_drop_down').hover(function(){
	showContent('right_drop_down'), hideContent('right_drop_down');
});
});

function showContent(div)
{
 $('#'+div+' .drop_down_content').show('blind', 'slow');
}
function hideContent(div)
{
 $('#'+div+' .drop_down_content').hide('blind', 'slow');
}
</script>

and here is the relevant html

        	<div id='left_drop_down' class='drop_down'>
            	<div class='drop_down_content' style='display: none;'>
                	<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />

                </div>
                <div class='drop_down_tab'>
                	Favorite Links
                </div>
            </div>

 

You can see what happens here

http://port2.ericwooley.com

Link to comment
https://forums.phpfreaks.com/topic/205759-jquery-dropdown-help/
Share on other sites

k, so i got a little progress. Now its just a browser issue.

changed

$('#left_drop_down').hover(function(){
	showContent('left_drop_down'), hideContent('left_drop_down');
});

$('#right_drop_down').hover(function(){
	showContent('right_drop_down'), hideContent('right_drop_down');
});

to

$('#left_drop_down').hover(
	function(){
			showContent('left_drop_down');
		},
		function() {
			hideContent('left_drop_down');
		}
);

$('#right_drop_down').hover(
		function(){
			showContent('right_drop_down');
		},
		function() {
			hideContent('right_drop_down');
		}
);

 

Which works in chrome & ie, but bugs out in firefox

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.