Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Spry Navigation in Zen Cart?

Spry Navigation in Zen Cart?

Locked

Views: 5,252

Results 1 to 14 of 14
This thread is locked. New replies are disabled.
15 Jul 2008, 5:44 PM
#1
Join Date:
Jun 2008
Posts:
18
Plugin Contributions:
0

Spry Navigation in Zen Cart?

Hi, I am new to zen cart and this is my first post. I gathered all the information that was in the "Before You Post a question" page below. I have been working on my site for months and looked extenisvely in forum and have the zen cart manual and I have not been able to find an answer to the following question:

I have put an horizontal Spry navigation bar,that I assembled in Dreamweaver, in my zen cart site in the tpl_header.php page. It shows up and the images rollovers work, but I can't seem to make the javascript that creates the drop down boxes work.
I have followed the steps from the forum
I have put this script: jscript_ SpryMenuBar.js in this folder:C:\xampp\htdocs\store\includes\templates\diva\jscript
I tried putting this code: <script language="javascript" src="includes/templates/diva/jscript/SpryMenuBar.js"></script> in the head section of the html_header.php file that is in C:\xampp\htdocs\store\includes\templates\diva\common, but nothing happens.

Can anyone tell me what I am doing incorrectly? I figure I have it in the wrong page or in the wrong part of the page, but the hunt and peck method is not working so I am hoping for guidance.

"Before You Post a question"
I have installed the image handler and customized both the CSS and admin pages of my site to get it to look more like I want it to.

Mine is a new installation Zen Cart 1.3.8a
My website is currently only locally on my computer
Server OS: Windows NT DELL-024B1D4ABD 5.1 build 2600
Database: MySQL 5.0.51a
Database Host: localhost (127.0.0.1)
PHP Version: 5.2.5 (Zend: 2.2.0)
HTTP Server: Apache/2.2.8 (Win32) DAV/2 mod_ssl/2.2.8 OpenSSL/0.9.8g mod_autoindex_color PHP/5.2.5

17 Jul 2008, 7:47 AM
#2
drbyte avatar

drbyte

Sensei

Join Date:
Jan 2004
Posts:
63,513
Plugin Contributions:
176

Re: Spry Navigation in Zen Cart?

Divalicious Chocolat:

I tried putting this code: <script language="javascript" src="includes/templates/diva/jscript/SpryMenuBar.js"></script> in the head section of the html_header.php file that is in C:\xampp\htdocs\store\includes\templates\diva\common, but nothing happens.
That could should be automatically generated simply by putting the file in the jscript folder, using the correct filename.
So, I recommend removing that line from your html_header.php file, since it will cause confusion.
Then proceed with the following ...

Divalicious Chocolat:

I have put this script: jscript_ SpryMenuBar.js in this folder:C:\xampp\htdocs\store\includes\templates\diva\jscript
With that in place, if you open your browser and go to http://localhost/store/index.php you'll see your menu.
Now, if you choose View Source (or sometimes View Page Source) from your browser menus, what does it show?
Post the first 50 lines here.
(it should show a line similar to what you'd added to html_header.php before, but with the correct filename)

17 Jul 2008, 2:43 PM
#3
Join Date:
Jun 2008
Posts:
18
Plugin Contributions:
0

Re: Spry Navigation in Zen Cart?

Dear Dr. Byte,

Thanks for getting back to me and looking into my problem. I do see that javascript code is in the source code below, but the drop down boxes are still not working, please advise.

Thanks again!
Jackie

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en">
<head>
<title>Divalicious Chocolate!, Cafe, Fondue, Fountain Rentals,  Tastings</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keywords" content="Gift Certificates New v1.2 Chocolate Posters Reci-tees Chocolates We Make Chocolates We Love ecommerce, open source, shop, online shopping " />
<meta name="description" content="Divalicious Chocolate! :  - Gift Certificates New v1.2 Chocolate Posters Reci-tees Chocolates We Make Chocolates We Love ecommerce, open source, shop, online shopping" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="author" content="The Zen Cart™ Team and others" />
<meta name="generator" content="shopping cart program by Zen Cart™, [url]http://www.zen-cart.com[/url] eCommerce" />
<meta name="robots" content="noindex, nofollow" />

<base href="http://diva.com/store/" />

<link rel="stylesheet" type="text/css" href="includes/templates/diva/css/style_imagehover.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/diva/css/stylesheet.css" />

<link rel="stylesheet" type="text/css" href="includes/templates/diva/css/stylesheet_css_buttons.css" />
<link rel="stylesheet" type="text/css" media="print" href="includes/templates/diva/css/print_stylesheet.css" />
<script type="text/javascript" src="includes/templates/diva/jscript/jscript_ SpryMenuBar.js"></script>

</head>

<body id="indexHomeBody">

<div id="mainWrapper">



<!--bof-header logo and navigation display-->

<div id="headerWrapper">
<!--bof-navigation display-->

<!<div id="navMainWrapper">
<div id="navMain">
    <ul class="back">
    <li><a href="http://diva.com/store/">Home</a></li>
    <li><a href="http://diva.com/store/index.php?main_page=login&zenid=2efefa55231638d098a13a5a3a131fb7">Log In</a></li>

</ul>
</div>
<div id="navMainSearch"><form name="quick_find_header" action="http://diva.com/store/index.php?main_page=advanced_search_result" method="get"><input type="hidden" name="main_page" value="advanced_search_result" /><input type="hidden" name="search_in_description" value="1" /><input type="hidden" name="zenid" value="2efefa55231638d098a13a5a3a131fb7" /><input type="text" name="keyword" size="6" maxlength="30" style="width: 100px" value="Find Chocolate" onfocus="if (this.value == 'Find Chocolate') this.value = '';" onblur="if (this.value == '') this.value = 'Find Chocolate';" /> <input class="cssButton button_search" onmouseover="this.className='cssButtonHover button_search button_searchHover'" onmouseout="this.className='cssButton button_search'" type="submit" value="Search" style="width: 80px;" /></form></div>
<br class="clearBoth" />
</div>
<!--eof-navigation display-->

<!--bof-branding display-->
<div id="logoWrapper">
    <div id="logo"><a href="http://diva.com/store/"><img src="includes/templates/diva/images/header_diva_chocolate.jpg" alt="Eat Chocolate Be Happy" title=" Eat Chocolate Be Happy " width="750" height="180" /></a></div>
</div>
18 Jul 2008, 4:53 AM
#4
drbyte avatar

drbyte

Sensei

Join Date:
Jan 2004
Posts:
63,513
Plugin Contributions:
176

Re: Spry Navigation in Zen Cart?

Why is there a space in the filename?```

<script type="text/javascript" src="[B]includes/templates/diva/jscript/jscript_ SpryMenuBar.js[/B]"></script>
18 Jul 2008, 3:30 PM
#5
Join Date:
Jun 2008
Posts:
18
Plugin Contributions:
0

Re: Spry Navigation in Zen Cart?

I have no idea why that space was there. Now I removed the space and the code is below. The drop down boxes still do not work. In the original page on my html site where I created the spry nav bar there is this code right below the javascript code. Does this call the javascript? DO I need something similar in the zen cart site?:

Thanks for your help,

Jackie

<link href="../diva_Common/SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en">
<head>
<title>Divalicious Chocolate!, Cafe, Fondue, Fountain Rentals,  Tastings</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keywords" content="Gift Certificates New v1.2 Chocolate Posters Reci-tees Chocolates We Make Chocolates We Love ecommerce, open source, shop, online shopping " />
<meta name="description" content="Divalicious Chocolate! :  - Gift Certificates New v1.2 Chocolate Posters Reci-tees Chocolates We Make Chocolates We Love ecommerce, open source, shop, online shopping" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="author" content="The Zen Cart™ Team and others" />
<meta name="generator" content="shopping cart program by Zen Cart™, [url]http://www.zen-cart.com[/url] eCommerce" />
<meta name="robots" content="noindex, nofollow" />

<base href="http://diva.com/store/" />

<link rel="stylesheet" type="text/css" href="includes/templates/diva/css/style_imagehover.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/diva/css/stylesheet.css" />

<link rel="stylesheet" type="text/css" href="includes/templates/diva/css/stylesheet_css_buttons.css" />
<link rel="stylesheet" type="text/css" media="print" href="includes/templates/diva/css/print_stylesheet.css" />
<script type="text/javascript" src="includes/templates/diva/jscript/jscript_SpryMenuBar.js"></script>

</head>

<body id="indexHomeBody">

<div id="mainWrapper">



<!--bof-header logo and navigation display-->

<div id="headerWrapper">
<!--bof-navigation display-->

<!<div id="navMainWrapper">
<div id="navMain">
    <ul class="back">
    <li><a href="http://diva.com/store/">Home</a></li>
    <li><a href="http://diva.com/store/index.php?main_page=login">Log In</a></li>

</ul>
</div>
<div id="navMainSearch"><form name="quick_find_header" action="http://diva.com/store/index.php?main_page=advanced_search_result" method="get"><input type="hidden" name="main_page" value="advanced_search_result" /><input type="hidden" name="search_in_description" value="1" /><input type="text" name="keyword" size="6" maxlength="30" style="width: 100px" value="Find Chocolate" onfocus="if (this.value == 'Find Chocolate') this.value = '';" onblur="if (this.value == '') this.value = 'Find Chocolate';" /> <input class="cssButton button_search" onmouseover="this.className='cssButtonHover button_search button_searchHover'" onmouseout="this.className='cssButton button_search'" type="submit" value="Search" style="width: 80px;" /></form></div>
<br class="clearBoth" />
</div>
<!--eof-navigation display-->

<!--bof-branding display-->
<div id="logoWrapper">
    <div id="logo"><a href="http://diva.com/store/"><img src="includes/templates/diva/images/header_diva_chocolate.jpg" alt="Eat Chocolate Be Happy" title=" Eat Chocolate Be Happy " width="750" height="180" /></a></div>
</div>
<br class="clearBoth" />
<!--eof-branding display-->
19 Jul 2008, 8:42 PM
#7
Join Date:
Jun 2008
Posts:
18
Plugin Contributions:
0

Re: Spry Navigation in Zen Cart?

A page opens and I see the javascript code below.

Thanks,

Jackie

/* SpryMenuBar.js - Revision: Spry Preview Release 1.4 */

// Copyright (c) 2006. Adobe Systems Incorporated.
// All rights reserved.
//
// Redistribution and use in source and binary forms, with or without
// modification, are permitted provided that the following conditions are met:
//
//   * Redistributions of source code must retain the above copyright notice,
//     this list of conditions and the following disclaimer.
//   * Redistributions in binary form must reproduce the above copyright notice,
//     this list of conditions and the following disclaimer in the documentation
//     and/or other materials provided with the distribution.
//   * Neither the name of Adobe Systems Incorporated nor the names of its
//     contributors may be used to endorse or promote products derived from this
//     software without specific prior written permission.
//
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
// AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
// IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
// ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
// LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
// CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
// SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
// INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
// CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
// ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
// POSSIBILITY OF SUCH DAMAGE.

/*******************************************************************************

 SpryMenuBar.js
 This file handles the JavaScript for Spry Menu Bar.  You should have no need
 to edit this file.  Some highlights of the MenuBar object is that timers are
 used to keep submenus from showing up until the user has hovered over the parent
 menu item for some time, as well as a timer for when they leave a submenu to keep
 showing that submenu until the timer fires.

 *******************************************************************************/

var Spry;
if(!Spry)
{
	Spry = {};
}
if(!Spry.Widget)
{
	Spry.Widget = {};
}

// Constructor for Menu Bar
// element should be an ID of an unordered list (<ul> tag)
// preloadImage1 and preloadImage2 are images for the rollover state of a menu
Spry.Widget.MenuBar = function(element, opts)
{
	this.init(element, opts);
};

Spry.Widget.MenuBar.prototype.init = function(element, opts)
{
	this.element = this.getElement(element);

	// represents the current (sub)menu we are operating on
	this.currMenu = null;

	var isie = (typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE');
	if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (isie && typeof document.uniqueID == 'undefined'))
	{
		// bail on older unsupported browsers
		return;
	}

	// load hover images now
	if(opts)
	{
		for(var k in opts)
		{
			var rollover = new Image;
			rollover.src = opts[k];
		}
	}

	if(this.element)
	{
		this.currMenu = this.element;
		var items = this.element.getElementsByTagName('li');
		for(var i=0; i<items.length; i++)
		{
			this.initialize(items[i], element, isie);
			if(isie)
			{
				this.addClassName(items[i], "MenuBarItemIE");
				items[i].style.position = "static";
			}
		}
		if(isie)
		{
			if(this.hasClassName(this.element, "MenuBarVertical"))
			{
				this.element.style.position = "relative";
			}
			var linkitems = this.element.getElementsByTagName('a');
			for(var i=0; i<linkitems.length; i++)
			{
				linkitems[i].style.position = "relative";
			}
		}
	}
};

Spry.Widget.MenuBar.prototype.getElement = function(ele)
{
	if (ele && typeof ele == "string")
		return document.getElementById(ele);
	return ele;
};

Spry.Widget.MenuBar.prototype.hasClassName = function(ele, className)
{
	if (!ele || !className || !ele.className || ele.className.search(new RegExp("\\b" + className + "\\b")) == -1)
	{
		return false;
	}
	return true;
};

Spry.Widget.MenuBar.prototype.addClassName = function(ele, className)
{
	if (!ele || !className || this.hasClassName(ele, className))
		return;
	ele.className += (ele.className ? " " : "") + className;
};

Spry.Widget.MenuBar.prototype.removeClassName = function(ele, className)
{
	if (!ele || !className || !this.hasClassName(ele, className))
		return;
	ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
};

// addEventListener for Menu Bar
// attach an event to a tag without creating obtrusive HTML code
Spry.Widget.MenuBar.prototype.addEventListener = function(element, eventType, handler, capture)
{
	try
	{
		if (element.addEventListener)
		{
			element.addEventListener(eventType, handler, capture);
		}
		else if (element.attachEvent)
		{
			element.attachEvent('on' + eventType, handler);
		}
	}
	catch (e) {}
};

// createIframeLayer for Menu Bar
// creates an IFRAME underneath a menu so that it will show above form controls and ActiveX
Spry.Widget.MenuBar.prototype.createIframeLayer = function(menu)
{
	var layer = document.createElement('iframe');
	layer.tabIndex = '-1';
	layer.src = 'javascript:false;';
	menu.parentNode.appendChild(layer);
	
	layer.style.left = menu.offsetLeft + 'px';
	layer.style.top = menu.offsetTop + 'px';
	layer.style.width = menu.offsetWidth + 'px';
	layer.style.height = menu.offsetHeight + 'px';
};

// removeIframeLayer for Menu Bar
// removes an IFRAME underneath a menu to reveal any form controls and ActiveX
Spry.Widget.MenuBar.prototype.removeIframeLayer =  function(menu)
{
	var layers = menu.parentNode.getElementsByTagName('iframe');
	while(layers.length > 0)
	{
		layers[0].parentNode.removeChild(layers[0]);
	}
};

// clearMenus for Menu Bar
// root is the top level unordered list (<ul> tag)
Spry.Widget.MenuBar.prototype.clearMenus = function(root)
{
	var menus = root.getElementsByTagName('ul');
	for(var i=0; i<menus.length; i++)
	{
		this.hideSubmenu(menus[i]);
	}
	this.removeClassName(this.element, "MenuBarActive");
};

// bubbledTextEvent for Menu Bar
// identify bubbled up text events in Safari so we can ignore them
Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
{
	return (navigator.vendor == 'Apple Computer, Inc.' && (event.target == event.relatedTarget.parentNode || (event.eventPhase == 3 && event.target.parentNode == event.relatedTarget)));
};

// showSubmenu for Menu Bar
// set the proper CSS class on this menu to show it
Spry.Widget.MenuBar.prototype.showSubmenu = function(menu)
{
	if(this.currMenu)
	{
		this.clearMenus(this.currMenu);
		this.currMenu = null;
	}
	
	if(menu)
	{
		this.addClassName(menu, "MenuBarSubmenuVisible");
		if(typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE')
		{
			if(!this.hasClassName(this.element, "MenuBarHorizontal") || menu.parentNode.parentNode != this.element)
			{
				menu.style.top = menu.parentNode.offsetTop + 'px';
			}
		}
		if(typeof document.uniqueID != "undefined")
		{
			this.createIframeLayer(menu);
		}
	}
	this.addClassName(this.element, "MenuBarActive");
};

// hideSubmenu for Menu Bar
// remove the proper CSS class on this menu to hide it
Spry.Widget.MenuBar.prototype.hideSubmenu = function(menu)
{
	if(menu)
	{
		this.removeClassName(menu, "MenuBarSubmenuVisible");
		if(typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE')
		{
			menu.style.top = '';
			menu.style.left = '';
		}
		this.removeIframeLayer(menu);
	}
};

// initialize for Menu Bar
// create event listeners for the Menu Bar widget so we can properly
// show and hide submenus
Spry.Widget.MenuBar.prototype.initialize = function(listitem, element, isie)
{
	var opentime, closetime;
	var link = listitem.getElementsByTagName('a')[0];
	var submenus = listitem.getElementsByTagName('ul');
	var menu = (submenus.length > 0 ? submenus[0] : null);

	var hasSubMenu = false;
	if(menu)
	{
		this.addClassName(link, "MenuBarItemSubmenu");
		hasSubMenu = true;
	}

	if(!isie)
	{
		// define a simple function that comes standard in IE to determine
		// if a node is within another node
		listitem.contains = function(testNode)
		{
			// this refers to the list item
			if(testNode == null)
			{
				return false;
			}
			if(testNode == this)
			{
				return true;
			}
			else
			{
				return this.contains(testNode.parentNode);
			}
		};
	}
	
	// need to save this for scope further down
	var self = this;

	this.addEventListener(listitem, 'mouseover', function(e)
	{
		if(self.bubbledTextEvent())
		{
			// ignore bubbled text events
			return;
		}
		clearTimeout(closetime);
		if(self.currMenu == listitem)
		{
			self.currMenu = null;
		}
		// show menu highlighting
		self.addClassName(link, hasSubMenu ? "MenuBarItemSubmenuHover" : "MenuBarItemHover");
		if(menu && !self.hasClassName(menu, "MenuBarSubmenuVisible"))
		{
			opentime = window.setTimeout(function(){self.showSubmenu(menu);}, 250);
		}
	}, false);

	this.addEventListener(listitem, 'mouseout', function(e)
	{
		if(self.bubbledTextEvent())
		{
			// ignore bubbled text events
			return;
		}

		var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);
		if(!listitem.contains(related))
		{
			clearTimeout(opentime);
			self.currMenu = listitem;

			// remove menu highlighting
			self.removeClassName(link, hasSubMenu ? "MenuBarItemSubmenuHover" : "MenuBarItemHover");
			if(menu)
			{
				closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, 600);
			}
		}
	}, false);
};
19 Jul 2008, 9:20 PM
#8
drbyte avatar

drbyte

Sensei

Join Date:
Jan 2004
Posts:
63,513
Plugin Contributions:
176

Re: Spry Navigation in Zen Cart?

Then I suspect the problem isn't with getting the javascript to be delivered to the browser properly.
The problem must be in the HTML you're using to trigger it.

20 Jul 2008, 7:13 PM
#9
Join Date:
Jun 2008
Posts:
18
Plugin Contributions:
0

Re: Spry Navigation in Zen Cart?

Right! I am assuming that similar to the html page where I originally made the spry nav bar and where there is this code in the header:

<script src="../diva_Common/SpryAssets/SpryMenuBar.js" type="text/javascript"></script> <link href="../diva_Common/SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />

I need to put the following code or something similar to it in the right place in the correct zen cart page, but I don't know which page it goes in or where in the page it goes since the php pages don't have headers, in order to call up the javascript. It may be that it's an html

<script type="text/javascript" src="includes/templates/diva/jscript/jscript_ SpryMenuBar.js"></script> <link href="includes/templates/diva/jscript/SpryMenuBarHorizontal.css"rel="stylesheet" type="text/css" />

Is this getting me any closer? Where do I need to put it?

Thanks for your help!

Jackie

20 Jul 2008, 7:34 PM
#10
drbyte avatar

drbyte

Sensei

Join Date:
Jan 2004
Posts:
63,513
Plugin Contributions:
176

Re: Spry Navigation in Zen Cart?

Divalicious Chocolat:

<link href="includes/templates/diva/jscript/SpryMenuBarHorizontal.css"rel="stylesheet" type="text/css" />

To get additional stylesheets to load, simply put them in the correct folder, using the correct naming, as per the documentation: http://www.zen-cart.com/wiki/index.php/Customisation_-_Templates_-_Stylesheets (also found in the /docs/ folder of your Zen Cart files).

ie:

move /includes/templates/diva/jscript/SpryMenuBarHorizontal.css
to /includes/templates/diva/css/styles_SpryMenuBarHorizontal.css

That'll make it automatically load on every page.

21 Jul 2008, 1:18 PM
#11
Join Date:
Jun 2008
Posts:
18
Plugin Contributions:
0

Re: Spry Navigation in Zen Cart?

Dear Dr.Byte,

I moved and renamed the file and there are still no drop down boxes. Don't I need to put the href code in the head of a certain file in order to call the javascript?

I do have a different quesion: There is a file in the css that is named style_imagehover.css, but you named the file styles_SpryMenuBarHorizontal. I read through the stylesheet info page, but I could not find a reference to renaming the style sheet specifically the way you did and I did not understand why one file is plural and the other is not. I found it confusing.

Thanks for your help!

Jackie

21 Jul 2008, 9:29 PM
#12
drbyte avatar

drbyte

Sensei

Join Date:
Jan 2004
Posts:
63,513
Plugin Contributions:
176

Re: Spry Navigation in Zen Cart?

As long as the filename starts with "style" and ends in ".css" it will get the <link href....> tag put into the head section of the page.

21 Jul 2008, 9:31 PM
#13
drbyte avatar

drbyte

Sensei

Join Date:
Jan 2004
Posts:
63,513
Plugin Contributions:
176

Re: Spry Navigation in Zen Cart?

Without seeing your page live, I suspect there's little else we can do to help troubleshoot your problem.

I've only been trying to help insomuch as getting your site loading the javascript and css files properly.
Getting the HTML right and troubleshooting the functionality is something better left to folks familiar with the Spry code itself.

24 Sep 2009, 2:30 PM
#14
kpcoyne avatar

kpcoyne

New Zenner

Join Date:
Aug 2009
Posts:
4
Plugin Contributions:
0

Re: Spry Navigation in Zen Cart?

I know this is a reply to a rather old post, but since I spent a CONSIDERABLE amount of time on the same problem, I am posting what solved the problem for me since I was unable to find the answer on this forum:

When creating the spry menu bar item, Dreamweaver puts a bit of script code at the bottom of the page to create the menu bar object that I seemed to have overlooked. The code from my Spry Menu bar is as follows:

<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("hmenubar", {imgDown:"/SpryAssets/SpryMenuBarDownHover.gif", imgRight:"/SpryAssets/SpryMenuBarRightHover.gif"});
</script>

After inserting this into my ZC footer template, the drop downs worked like a charm!