Post by Jacob » Tue Mar 01, 2011 10:33 pm

Hello
We have a Jquery collapsing menu and we want the sublinks to stay visible when clicked and on the clicked page. There is a demo of it working here: http://thepixelforge.net/misc/wpc/Jacob/index.htm (only first two sub menus are functional). The same code added to template/common/header.tpl makes all the <dd> submenu links visible on our shop home page here: l o n d o n t s h i r t dot com? We need help stop them form being visible on the home page.

Also there is a problem with the jquery working in Firefox, I have tested in Chrome and Safari.

Code: Select all

 <div id="nav"><!--// START NAV //-->
      <h3 class="head">Tshirts & souvenirs</h3>
<dl id="nav">
	<dt class="nav"><b>London Tshirts</b></dt>
	<dd>
		<ul>
			<li><a href="/Unisex">Unisex</a></li>
			<li><a href="/Slimfit">Slimfit</a></li>
			<li><a href="/Kids">Kids</a></li>
	
		</ul>
	</dd>
	<dt class="nav"><b>Alternative Tshirts</b></dt>
	<dd>
		<ul class="nav">
            <li><a href="/England">England</a></li>
			<li><a href="/Humour">Humour</a></li>
             <li><a href="/Popular">Popular</a></li>
			</ul>
	</dd>
	<dt class="nav"><b>Magnets</b></dt>
	<dd>
		<ul class="nav">
			<li><a href="/magnets-ceramic">Ceramic</a></li>
            <li><a href="/magnets-metal">Metal</a></li>
			<li><a href="/magents-plastic">Plastic</a></li>
		</ul>
	</dd>
	<dt class="nav"><b>Keyrings</b></dt>
	<dd>
		<ul class="nav">
			<li><a href="/keyrings-ceramic">Ceramic</a></li>
            <li><a href="/keyrings-metal">Metal</a></li>
			<li><a href="/keyrings-plastic">Plastic</a></li>
		</ul>
	</dd>
    <dt class="nav"><b>Other gifts</b></dt>
	<dd>
		<ul class="nav">
			<li><a href="/Hats">Hats</a></li>
            <li><a href="/Models">Models</a></li>
			<li><a href="/Bags">Bags</a></li>
		</ul>
	</dd>
</dl>

	</div><!--// END NAV //-->

Code: Select all

// This gets the last part of the url by stripping off the beginning and the trailing slash;
// l o n d o n t s h i r t dot com/England/ therefore becomes England:

var curPage = ((/[^/]+\/?$/.exec(window.location.pathname))[0]).replace(/\/$/, '');

$(document).ready(function(){


// This searches for an anchor whose href ends with the previous variable and adds a class for future use:

	$('dd > ul li a[href$="'+curPage+'"]').addClass('current-page');


// This searches back up the hierarchy and searches for its ancestor dd and adds another class:

	$('.current-page').closest('dd').addClass("current-section");


//This shows the active section

	$('.current-section').show(function(){


		// This adds a class to the bold tag of the related dt. The intention is that it will help
		// integrate with the original script:

		$(this).prev().children().addClass("clicked");
	});
	
	
	if($("#nav")) {
		$("#nav dd").hide();
		$("#nav dt.nav b").click(function() {
			if(this.className.indexOf("clicked") != -1) {
				$(this).parent().next().slideUp(200, function() {
					// This is 'supposed' to hide the current section if another is clicked, but its not working and I'm stumped
					$('.current-section').slideDown(200);					
				});
				$(this).removeClass("clicked");
			}else{
				$("#nav dt.nav b").removeClass();
				$(this).addClass("clicked");
				$("#nav dd:visible").slideUp(200);
				$(this).parent().next().slideDown(200, function() {
					// This is 'supposed' to hide the current section if another is clicked, but its not working and I'm stumped
					$('.current-section').slideUp(200);					
				});
			}return false;
		});
	};
});
Thanks

v1.4.9.1

Edit: took out live url.
Last edited by Jacob on Thu Jun 09, 2011 9:15 pm, edited 1 time in total.

Active Member

Posts

Joined
Thu Dec 04, 2008 9:17 pm

Post by Jacob » Sat Mar 19, 2011 4:45 am

Bump :)

Is my post clear?

The jqeury accordion menu works on basic html pages we tested on. There seems to be something within the open cart directory files that is interfering /over riding our navigation menu, causing the child links to appear visible on the home page but not on the product pages?

Please help

Active Member

Posts

Joined
Thu Dec 04, 2008 9:17 pm

Post by zax » Thu Apr 07, 2011 11:03 pm

Hi Jacob

Did you solved this problem? I would like to do something similar at my OC shop but I dont have any idea how to do that...

zax
Newbie

Posts

Joined
Thu Apr 07, 2011 11:00 pm

Post by Jacob » Fri Apr 08, 2011 6:28 am

Hi Zax,

We used a category accordion menu extension in the end which works just how we want it. We needed to do a few tweaks, which we were able to get help with from the creator.

http://www.opencart.com/index.php?route ... ion_id=421

Active Member

Posts

Joined
Thu Dec 04, 2008 9:17 pm
Who is online

Users browsing this forum: No registered users and 19 guests