1 Replies - 2960 Views - Last Post: 07 February 2010 - 09:11 PM

#1 Guest_xfodder*


Reputation:

JQuery tabbed accordion menu system

Posted 07 February 2010 - 09:00 PM

hey people ...
im developing a personal site at the moment, using jquery (1.4.1) to create a tabbed accordion menu system ... rather than me trying to explain what that is, take a look at it over here: http://www.digitalsicness.net/beta2 i am rather new to jquery (and javascript) ... i can get by, but i still have a lot to learn ...

now the problem i am having is if you click on the menu items fairly quickly (pressing the menu items as fast as you can) two of the sections load stacked on top of each other. i have researched around and have found that using callbacks might possibly fix my problem ... but i cant seem to figure our how to implement a callback with my system.

i know the likelihood of someone actually pressing my menu that fast is slim ... but it is really bothering me can anyone offer a suggestion, or point me in the right direction?

also if anyone has suggestions for anything else you may see wrong with my code go right ahead ... i have attached my js file to make it easier to view my code.

 $(document).ready(function(){
	$('#about').hide();
	$('#contact').hide();
	$('#work').hide();
	var $activeMenu = null;
	$activeMenu = ('#about');

	$('#toggle_about').click(function () {
		if ($activeMenu == '#about') {
		$('#about').slideToggle(600); }
		else {
		$($activeMenu).slideUp(600, function() {$('#about').slideDown(600);}); }
		$activeMenu = ("#about");
		$('#contactBox a').removeClass('menuSelected');
		$('#workBox a').removeClass('menuSelected');
		$('#aboutBox a').toggleClass('menuSelected');
		return false; 
    });
	
	$('#toggle_contact').click(function () { 
	   	if ($activeMenu == '#contact') {
	   	$('#contact').slideToggle(600); }
	   	else {
	   	$($activeMenu).slideUp(600, function() {$('#contact').slideDown(600);}); }
	   	$activeMenu = ("#contact");
		$('#aboutBox a').removeClass('menuSelected');
		$('#workBox a').removeClass('menuSelected');
		$('#contactBox a').toggleClass('menuSelected');
		return false; 
	});
	
	$('#toggle_work').click(function () {
		if ($activeMenu == '#work') {
		$('#work').slideToggle(600); }
		else {
	   	$($activeMenu).slideUp(600, function() {$('#work').slideDown(600);}); }
	   	$activeMenu = ("#work");
		$('#aboutBox a').removeClass('menuSelected');
		$('#contactBox a').removeClass('menuSelected');
		$('#workBox a').toggleClass('menuSelected');
		return false; 
	});	
	
 });



Is This A Good Question/Topic? 0

Replies To: JQuery tabbed accordion menu system

#2 xfodder  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 1
  • View blog
  • Posts: 72
  • Joined: 24-November 02

Re: JQuery tabbed accordion menu system

Posted 07 February 2010 - 09:11 PM

whats with my username?
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1