Jump to content
Sign in to follow this  
fear4me

CSS Menu

Recommended Posts

Or if that can't be done just resizing all the Subcategories would be fine with me :)

Edited by Kuujiryo

Share this post


Link to post
Share on other sites

Ok, I've got it installed with STS.

 

However, my left column is 150px. The menu is 200px. I have tried changing some variables in categores_css.php but it has no effect.

 

Any ideas?

<?php
/*
 $Id: categories.php,v 1.25 2003/07/09 01:13:58 hpdl Exp $

 osCommerce, Open Source E-Commerce Solutions
 http://www.oscommerce.com

 Copyright (c) 2003 osCommerce

 Released under the GNU General Public License
*/
?>
<style type="text/css">

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.suckerdiv ul{
margin: 0;
padding: 0;
list-style-type: none;
width: 100%; /* Width of Menu Items */
border-bottom: 1px solid #ccc;
font-family: arial;
font-size: 11px;
}

.suckerdiv ul li{
position: relative;
background-color: #eee;
}

/*1st level sub menu style */
.suckerdiv ul li ul{
left: 100%; /* Parent menu width - 1*/
position: absolute;
width: 100%; /*sub menu width*/
top: 0;
display: none;
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li ul{ 
left: 100%; /* Parent menu width - 1*/
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li a{ 
left: 100%; /* Parent menu width - 1*/
background-color: #ddd;
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li ul li a{ 
background-color: #bbb;
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li ul li ul li a{ 
background-color: #aaa;
}

/* menu links style */
.suckerdiv ul li a{
display: block;
color: black;
text-decoration: none;
background-color: #eee;
padding: 1px 5px;
border: 1px solid #ccc;
border-bottom: 0;
line-height: 2em;
}

.suckerdiv ul li a:visited{
color: black;
}

.suckerdiv ul li a:hover{
background-color: yellow;
color: black;
text-decoration: none;
}

.suckerdiv ul li ul li a:hover{
background-color: yellow;
color: black;
text-decoration: none;
}

.suckerdiv ul li ul li ul li a:hover{
background-color: yellow;
color: black;
text-decoration: none;
}

/* The main categories with sub-categories */
.suckerdiv .subfolderstyle{
background: url(images/arrow-list.gif) no-repeat center right;
}

/* This one colors the sub-folder with other sub-folders */
.suckerdiv ul li ul .subfolderstyle {
background-color: #ddd;
}

/* This one colors the sub-folder with other sub-folders */
.suckerdiv ul li ul li ul .subfolderstyle {
background-color: #bbb;
}

/* This one colors the sub-folder with other sub-folders */
.suckerdiv ul li ul li ul li ul .subfolderstyle {
background-color: #aaa;
}

/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */

</style>

<script type="text/javascript">

//SuckerTree Vertical Menu (Aug 4th, 06)
//By Dynamic Drive: http://www.dynamicdrive.com/style/

var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas

function buildsubmenus(){
for (var i=0; i<menuids.length; i++){
 var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
for (var t=0; t<ultags.length; t++){
ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle"
ultags[t].parentNode.onmouseover=function(){
this.getElementsByTagName("ul")[0].style.display="block"
}
ultags[t].parentNode.onmouseout=function(){
this.getElementsByTagName("ul")[0].style.display="none"
}
}
 }
}

if (window.addEventListener)
window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent)
window.attachEvent("onload", buildsubmenus)

</script>
<?
 function PrintSubMenus( $parentID, $languageID, $start_path ){
  $returnval = '';
  if (($start_path == '') && ($parentID > 0)) {
	$start_path = $parentID;
  } else {
	if ($parentID > 0) $start_path .= "_" . $parentID;
  }
  if ($parentID != 0) {
	$returnval .= "<ul>";
  } else {
	$returnval .= "<div class='suckerdiv'>";
	$returnval .= "<ul id='suckertree1'>";
  }
  $categories_query = tep_db_query("select c.categories_id, cd.categories_name, c.parent_id from " . TABLE_CATEGORIES . " c, " . TABLE_CATEGORIES_DESCRIPTION . " cd where c.parent_id = '".$parentID."' and c.categories_id = cd.categories_id and cd.language_id='" . (int)$languageID ."' order by sort_order, cd.categories_name");
  while ($categories = tep_db_fetch_array($categories_query))  {
	if ($start_path == "") {
	  $grouppath = $categories['categories_id'];
	} else {
	  $grouppath = $start_path . "_" . $categories['categories_id'];
	}
	$cPath_new = 'cPath=' . $grouppath;
	$categories_string = tep_href_link(FILENAME_DEFAULT, $cPath_new);
	$returnval .= "<li><a href='".$categories_string."'>".$categories['categories_name']."</a>";
	if ( tep_has_category_subcategories($categories['categories_id'] ) ) {
	   $returnval .= PrintSubMenus( $categories['categories_id'], $languageID, $start_path );
	}
	$returnval .= "</li>";
  }
  $returnval .= "</ul>";
  if ($parentID == 0) $returnval .= "</div>";
  return $returnval;
 }
?>
<!-- categories //-->
	  <tr>
		<td>
<?php
 $info_box_contents = array();
 $info_box_contents[] = array('text' => BOX_HEADING_CATEGORIES);

 new infoBoxHeading($info_box_contents, true, false);

 $info_box_contents = array();
 $info_box_contents[] = array('text' => PrintSubMenus( 0, $languages_id, '' ));

 new infoBox($info_box_contents);

?>
		</td>
	  </tr>
<!-- categories_eof //-->

Share this post


Link to post
Share on other sites

Hi,

 

this menu is very slow to load...for 200 products it's took 7 seconds to load on every page.

 

 

I hope other menu will be implemented only few menu are available and they are slow to load.

 

for now i'll stay with dynamenu


Lenamtl

Share this post


Link to post
Share on other sites

That sounds odd. Mine takes less than a second for the complete page load including the menu with more products than that (but I only go down to category level not product level).

Share this post


Link to post
Share on other sites

Hi Guys

 

some troubles with this css menu few weeks ago, i had to change for the old ms2 menu... >_<

It worked perfectly for a year and troubles appeared suddenty, without code modification...

 

Now, I get these errors

 

Warning: Invalid argument supplied for foreach() in /home/Www/xxxxxx/includes/boxes/categories.php on line 243

 

line 243: foreach($categories_start as $key => $value) {

 

Warning: Invalid argument supplied for foreach() in /home/Www/xxxxxx/includes/boxes/categories.php on line 251

 

line 251: foreach ($cat_subs[$parentID] as $v) { //$categories = tep_db_fetch_array($categories_query)

 

Can't explain this problem... Any ideas?

 

For information: PHP Version 4.4.6 used

Share this post


Link to post
Share on other sites

Is there anyway to make the subcategories apear on the top of this menu ie underneatht he main categories?

 

Thanks

Share this post


Link to post
Share on other sites

Hi i have downloaded the latest version of CSS Menu - is there anyway to just show the top categories - ie i don't require the fly-out sub menus

 

Also the menu has picked up:

BOX_INFORMATION_ALLPRODS

BOX_SPECIALS_ALLPRODS

BOX_WHATSNEW_ALLPRODS

 

which i don't requrie

 

http://www.violateclothing.com/catalog/index.php

Share this post


Link to post
Share on other sites

PERFECT !!!! Just what i was looking for.

 

Thanx m8

 

 

 

 

 

Thanks David for sending me the file. I have my menu working now and the code is below.

 

var menuids=["suckertree1","suckertree2","suckertree3"] //Enter id(s) of SuckerTree UL menus, separated by commas

 

<?php
 $info_box_contents = array();
 $info_box_contents[] = array('text' => BOX_HEADING_CATEGORIES);

//  new infoBoxHeading($info_box_contents, true, false);

 $info_box_contents = array();

 $info_box_contents[] = array('text' => //'<div class="suckerdiv"><ul id="suckertree3"><li><a href='.tep_href_link("index.php").'>Home</a></ul>' .
'<a ' . tep_image(DIR_WS_IMAGES . 'infobox/Pictures.jpg', 'Galleries') . '</a>'
. PrintSubMenus( 0, $languages_id, '' ). '<a ' . tep_image(DIR_WS_IMAGES . 'infobox/TravelInfob.jpg', 'Galleries') . '</a>'
. '<div class="suckerdiv"><ul id="suckertree2"><li><a href='.tep_href_link("Tips.php").'>Travel Tips</a><a href='.tep_href_link("Tips.php").'>Culture</a><a href='.tep_href_link("Tips.php").'>Language</a><a href='.tep_href_link("Tips.php").'>History</a></ul></div>');

 $info_box_contents[] = array('text' => '<div class="suckerdiv"><ul id="suckertree3"><li><a href='.tep_href_link("links.php").'>Links</a><ul><li><a href="http://www.lonelyplanet.com/" target="_blank">Lonely Planet</a></li><li><a href="http://www.danheller.com/" target="_blank">Dan Heller</a></li><li><a href='.tep_href_link("rss.php").'>RSS Feed</a></li></ul>');
//  $info_box_contents[] = array('text' => PrintSubMenus( 0, $languages_id, '' ));
//  $info_box_contents[] = array('align' => 'center',
//							  'text'  => '<a href="' . tep_href_link(FILENAME_ALLPRODS, '', 'NONSSL') . '">' . BOX_INFORMATION_ALLPRODS . '</a>');
//  $info_box_contents[] = array('align' => 'center',
//							   'text'  => '<a href="' . tep_href_link(FILENAME_SPECIALS, '', 'NONSSL') . '">' . BOX_SPECIALS_ALLPRODS . '</a>');
//  $info_box_contents[] = array('align' => 'center',
//							   'text' => '<a href="' . tep_href_link(FILENAME_PRODUCTS_NEW) . '">' . BOX_WHATSNEW_ALLPRODS .'</a>');							   

 new infoBox($info_box_contents);

?>
		</td>
	  </tr>

<!-- MenuConfigategories_eof //-->

 

As I am using a picture for my header I commented out new infoBoxHeading.

 

Hopefully it's be helpful to someone.

Share this post


Link to post
Share on other sites

hi, i have http://addons.oscommerce.com/info/4910 fixed width

my css with this edit has this info in it:

 

BODY {

text-align: center;

color: #ffffff;

/* change background: #000000; to the color of your choice*/

background: #99CCFF;

margin: 0;

}

#cwdusacontainer {

width: 97%;

border: 0px solid #916714;/*border can be removed for a borderless page*/

background: #000000;

color: #ffffff;

margin: 10px auto 10px auto;/*this codeing is margin top 10px,right auto, bottom 10px and left 10px. Don't change the auto*/

text-align: left;

}

 

 

i installed this today, but the menu is showing at the very top of the page, see picture

menutop1.gif

 

how do i fix this problem ?

thank you :thumbsup:

Share this post


Link to post
Share on other sites

HELP

I've got a problem with this css menu

 

the menu works perfect

but as you can see on my site http://www.professionalsound.nl

the menu gose of screen when i go to submenu's..

the list is to big to be in my internetexplorer and the last in list are off the page..

(can't see them) anybody got a solution?

 

thanks allready

Share this post


Link to post
Share on other sites
hi, i have http://addons.oscommerce.com/info/4910 fixed width

my css with this edit has this info in it:

 

i installed this today, but the menu is showing at the very top of the page, see picture

menutop1.gif

 

how do i fix this problem ?

thank you :thumbsup:

 

 

can someone please please please help me i really would love to use this menu, please!

Share this post


Link to post
Share on other sites

Rather than the categories 'popping' into view is there a way they can 'fade in' or 'scroll out' into view?

 

I'm gonna look for a CSS to add that may do this, but if anyone has an idea how to do this already, I'd appreciate it.

 

I've looked through piles and piles of CSS Menu examples all over the net, but I cannot find one that actually does it as yet! It'd make it more unique and a lot better. :)

Share this post


Link to post
Share on other sites

great contribution

 

anyone know an easy way of taking it out of its box settings, so that it can be placed anywere? I want to put it in my header

Share this post


Link to post
Share on other sites
Turns out it was a 'Cache' problem.

 

I dont seem to be able to 'Cache' the CSS menu when visitors hit my site from http://www.mydomain.com or http://mydomain.com I think this is because there is no actual file to 'Cache' (http://www.mydomain.com/index.php)

 

Bug perhaps? Can it be fixed? I've turned 'Cache' off for now, which is a shame.

 

Does this mean that the contribution won't work with ultimate seo urls by chemo?


I'm working on multiple stores with multiple problems.

Share this post


Link to post
Share on other sites

i get an error if there is no category.

i am using it in a multi shop and sometimes there is no category or product entered yet

stupid situation yes but is there a way not to get error about array being empty

Edited by tedbooks

Share this post


Link to post
Share on other sites
Turns out it was a 'Cache' problem.

 

I dont seem to be able to 'Cache' the CSS menu when visitors hit my site from http://www.mydomain.com or http://mydomain.com I think this is because there is no actual file to 'Cache' (http://www.mydomain.com/index.php)

 

Bug perhaps? Can it be fixed? I've turned 'Cache' off for now, which is a shame.

 

 

same problem i have SEO installed , i had to turn cache off just to the the menu to work and show up

 

and now turning the cache off the menu displays correctly

 

BUT

 

when clicking on any of the links on the menu i get this error:

 

Fatal error: Call to undefined function: read_cache() in /home/puregnet/public_html/shop/includes/classes/url_rewrite.php on line 215

 

 

i am sure it is because i have SEO G installed... any help ?

Share this post


Link to post
Share on other sites
same problem i have SEO installed , i had to turn cache off just to the the menu to work and show up

 

and now turning the cache off the menu displays correctly

 

BUT

 

when clicking on any of the links on the menu i get this error:

 

Fatal error: Call to undefined function: read_cache() in /home/puregnet/public_html/shop/includes/classes/url_rewrite.php on line 215

i am sure it is because i have SEO G installed... any help ?

 

nevermind it was not seo g causing the problem

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×