Zen Cart Logo
Forums / Addon Sideboxes / Support for CSS Flyout Menu

Support for CSS Flyout Menu

Views: 180,519

Results 721 to 740 of 755
26 Mar 2012, 1:17 PM
#721
divavocals avatar

divavocals

Totally Zenned

Join Date:
Jan 2007
Location:
Los Angeles, California, United States
Posts:
10,011
Plugin Contributions:
3

Support for CSS Flyout Menu

gotyed:

Hi,

I didn't really understand what you meant in your example, I don't have the dropdown menu, but the CSS Flyout Menu installed.
I used it to replace my categories sidebox, so I asked the questions. Sorry for the misunderstanding .

BTW, I resolved the thing with the points, it was stupid not to look around, but concerning the product count I couldn't find the answer.

Thank you!Sorry.. I mixed your posts up with someone else's :laugh::laugh::laugh: I need to READ before I post..:smile:

28 Mar 2012, 3:58 AM
#722
get_em_fast avatar

get_em_fast

Totally Zenned

Join Date:
Dec 2006
Location:
Seligman, MO U.S.A.
Posts:
2,072
Plugin Contributions:
1

Re: Support for CSS Flyout Menu

DivaVocals:

Looks like the good folks at Template Monstrosity oops I mean Template Monster "borrowed" the code from the CSS dropdown menu.. (which I'm sure they fully disclosed.. yeah right..)
Sorry to be OT here, but couldn't help but giggle at Diva's comment.................

Uh-hu...........just like they're sharing the profit. :no:

That's okay, though. I know who put in the sweat and tears, AND I know something they apparently DON'T................that's the fact that this menu was "quick and dirty", but served the purpose for the time being.

AND the fact that I'm currently working (what little time I have to work on it) on a brand new, TOTALLY KICK-:censored: version(s) of BOTH the dropdown AND flyout menu's that I'm taking my time on, doing it all right, and will be cleaner, smoother, and overall more efficient for the shop-owners' customers, and will be less "weight" for overall operation of the shop-owners' site(s).

But..............since I'm now working a 8 - 5 "real" job these days (instead of design work), the new release(s) will be A WHILE away..............2 - 3 months at least.

28 Mar 2012, 4:16 AM
#723
divavocals avatar

divavocals

Totally Zenned

Join Date:
Jan 2007
Location:
Los Angeles, California, United States
Posts:
10,011
Plugin Contributions:
3

Re: Support for CSS Flyout Menu

Get Em Fast:

Sorry to be OT here, but couldn't help but giggle at Diva's comment.................

Uh-hu...........just like they're sharing the profit. :no: .
As my friend's grandma use to say, "Tell the truth, shame the devil!!" LOL
Get Em Fast:

But..............since I'm now working a 8 - 5 "real" job these days (instead of design work), the new release(s) will be A WHILE away..............2 - 3 months at least.and I will be PATIENTLY waiting..:yes:

30 Mar 2012, 2:18 PM
#724
bravo14 avatar

bravo14

New Zenner

Join Date:
Oct 2009
Posts:
24
Plugin Contributions:
0

Re: Support for CSS Flyout Menu

Hi

I have just installed the CSS FLyout header, and it has stopped the remained of the page from showing

<!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>The Flower Stall, Flowers for all Occasions</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keywords" content="Weddings Sympathy Anniversaries Just to say.... Mothers Day Nappy Cakes Corporate Gift Vouchers Weddings, Anniversaries, valentine, anniversary, sorry, birthday, gift, flowers, present " />
<meta name="description" content="The Flower Stall :  - Weddings Sympathy Anniversaries Just to say.... Mothers Day Nappy Cakes Corporate Gift Vouchers Weddings, Anniversaries, valentine, anniversary, sorry, birthday, gift, flowers, present" />
<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™, http://www.zen-cart.com eCommerce" />
 
<base href="http://www.the-flower-stall.co.uk/" />
<link rel="canonical" href="http://www.the-flower-stall.co.uk/" />
 
<link rel="stylesheet" type="text/css" href="includes/templates/the-flower-stall/css/stylesheet.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/the-flower-stall/css/stylesheet_css_buttons.css" />
<link rel="stylesheet" type="text/css" href="includes/templates/the-flower-stall/css/stylesheet_header_menu.css" />
<link rel="stylesheet" type="text/css" media="print" href="includes/templates/the-flower-stall/css/print_stylesheet.css" />
</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">
      <div id="navMainLinks">
        <ul class="back">
          <li><a href="http://www.the-flower-stall.co.uk/">Home</a></li>
                    <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=login&zenid=n49ig91352h7svbn03jfb8ell5">Log In</a></li>
                            </ul>
      </div>
      <div id="navMainSearch">
              </div>
    </div>
  </div>
  <div class="clearBoth"></div>
  <!--eof-navigation display-->
  <!--bof-branding display-->
  <div id="logoWrapperOuter">
    <div id="logoWrapper">
      <div id="logo"><a href="http://www.the-flower-stall.co.uk/"><img src="includes/templates/template_default/images/logo.jpg" alt="The Flower Stall" title=" The Flower Stall " width="700px" height="111px" /></a></div>
          </div>
  </div>
</div>
<div class="clearBoth"></div>
<!--eof-branding display-->
<!--eof-header logo and navigation display-->
<!--bof-header ezpage links-->
<!--eof-header ezpage links-->
<!--bof-optional categories tabs navigation display-->
<div id="navCatTabsWrapper">
<div id="navCatTabs">
<ul>
  <li><a class="category-top" href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=4&zenid=n49ig91352h7svbn03jfb8ell5">Anniversaries</a> </li>
  <li><a class="category-top" href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=9&zenid=n49ig91352h7svbn03jfb8ell5">Corporate</a> </li>
  <li><a class="category-top" href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=6&zenid=n49ig91352h7svbn03jfb8ell5">Just to say....</a> </li>
  <li><a class="category-top" href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=7&zenid=n49ig91352h7svbn03jfb8ell5">Mothers Day</a> </li>
  <li><a class="category-top" href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=8&zenid=n49ig91352h7svbn03jfb8ell5">Nappy Cakes</a> </li>
  <li><a class="category-top" href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=3&zenid=n49ig91352h7svbn03jfb8ell5">Sympathy</a> </li>
  <li><a class="category-top" href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=1&zenid=n49ig91352h7svbn03jfb8ell5">Weddings</a> </li>
  <li><a class="category-top" href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=10&zenid=n49ig91352h7svbn03jfb8ell5">Gift Vouchers</a> </li>
</ul>
</div>
</div>
<!--eof-optional categories tabs navigation display-->
<!--bof-drop down menu display-->
<!-- menu area -->
<div id="dropMenuWrapper">
  <div id="dropMenuWrapperb">
    <div id="dropMenuWrapperc">
      <div id="dropMenuWrapperd">
        <div id="dropMenu">
          <ul class="level1">
            <li class="submenu"><a href="http://www.the-flower-stall.co.uk/index.php?main_page=index&zenid=n49ig91352h7svbn03jfb8ell5">Home</a>
              <ul class="level2">
                <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=products_new&zenid=n49ig91352h7svbn03jfb8ell5">New Products</a></li>
                <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=products_all&zenid=n49ig91352h7svbn03jfb8ell5">All Products</a></li>
                <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=specials&zenid=n49ig91352h7svbn03jfb8ell5">Specials</a></li>
                <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=advanced_search&zenid=n49ig91352h7svbn03jfb8ell5">Search</a></li>
              </ul>
            </li>
            <li class="submenu"><a href="http://www.the-flower-stall.co.uk/index.php?main_page=site_map&zenid=n49ig91352h7svbn03jfb8ell5">Categories</a>
              <ul class="level2"><li>
<a href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=4&zenid=n49ig91352h7svbn03jfb8ell5">Anniversaries</a></li><li>
<a href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=9&zenid=n49ig91352h7svbn03jfb8ell5">Corporate</a></li><li>
<a href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=6&zenid=n49ig91352h7svbn03jfb8ell5">Just to say....</a></li><li>
<a href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=7&zenid=n49ig91352h7svbn03jfb8ell5">Mothers Day</a></li><li>
<a href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=8&zenid=n49ig91352h7svbn03jfb8ell5">Nappy Cakes</a></li><li>
<a href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=3&zenid=n49ig91352h7svbn03jfb8ell5">Sympathy</a></li><li>
<a href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=1&zenid=n49ig91352h7svbn03jfb8ell5">Weddings</a></li><li>
<a href="http://www.the-flower-stall.co.uk/index.php?main_page=index&cPath=10&zenid=n49ig91352h7svbn03jfb8ell5">Gift Vouchers</a></li></ul>            </li>
            <li class="submenu"><a href="http://www.the-flower-stall.co.uk/index.php?main_page=index&zenid=n49ig91352h7svbn03jfb8ell5">Information</a>
              <ul class="level2">
			                    <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=shippinginfo&zenid=n49ig91352h7svbn03jfb8ell5">Shipping Info</a></li>
								                <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=privacy&zenid=n49ig91352h7svbn03jfb8ell5">Privacy Policy</a></li>
								                <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=conditions&zenid=n49ig91352h7svbn03jfb8ell5">Conditions of Use</a></li>
				                <!--<li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=FILENAME_ABOUT_US&zenid=n49ig91352h7svbn03jfb8ell5">About Us</a></li>-->
                                <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=site_map&zenid=n49ig91352h7svbn03jfb8ell5">Site Map</a></li>
                                                <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=gv_faq&zenid=n49ig91352h7svbn03jfb8ell5">Gift Certificate FAQ</a></li>
                                                <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=discount_coupon&zenid=n49ig91352h7svbn03jfb8ell5">Discount Coupons</a></li>
                                                <li><a href="http://www.the-flower-stall.co.uk/index.php?main_page=unsubscribe&zenid=n49ig91352h7svbn03jfb8ell5">Newsletter Unsubscribe</a></li>

It doesn't appear to have completed the <ul> tag but I am not sure why

It also has started using a logo image from the template_default folder instead of the template I have put together.

30 Mar 2012, 2:31 PM
#725
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Support for CSS Flyout Menu

This thread is for the flyout sidebox menu, not the dropdown header menu. It would be better to post there to keep information in the relevant place.

Did you alter the file that makes the Information submenu? If so, you might have introduced a PHP error, which is what would stop it from executing like that. Are there supposed to be any more items in that submenu, or is </ul> supposed to be the next thing?

Answer these questions when you repost in the correct thread.

16 May 2012, 10:36 PM
#726
bridge32 avatar

bridge32

Zen Follower

Join Date:
Jun 2011
Posts:
145
Plugin Contributions:
0

Re: Support for CSS Flyout Menu

Sorry to bring up an old thread, but i ahve this installed and i have spent time trying to figure out the small issue i have.
The issue is that when you have your mouse over the top category, the second level category flies out, but when you go to move your mouse to the 2nd level category it disappears.
The only way of getting it to work is if you move your mouse quickly onto the boxes.
Does anyone know how to overcome this problem, like speed or delay setting?
I am running version 1.39h and the site is https://www.cakekraft.co.uk if you are able to have a look and see what i mean.
Thank you
Nic.

17 May 2012, 12:42 AM
#727
get_em_fast avatar

get_em_fast

Totally Zenned

Join Date:
Dec 2006
Location:
Seligman, MO U.S.A.
Posts:
2,072
Plugin Contributions:
1

Re: Support for CSS Flyout Menu

Find this block of code in your stylesheet_categories_menu.css:

#nav-cat ul ul {
   position: absolute; 
   top: 0; 
   left: 200px;
   display: none;
}

and change the 200 to something like 190, making that block look like:

#nav-cat ul ul {
   position: absolute; 
   top: 0; 
   left: 190px;
   display: none;
}

That will move the "flyout's" closer in toward the current level, closing the gap in between the two...............it's that little tiny gap that your mouse is hitting, letting the menu "go away" before you get to the next level.

But, as you can see......................it's an easy fix. :smile:

Hope this helps.

17 May 2012, 11:50 AM
#728
bridge32 avatar

bridge32

Zen Follower

Join Date:
Jun 2011
Posts:
145
Plugin Contributions:
0

Re: Support for CSS Flyout Menu

Thank you for the quick response, where can i find this file to edit.
Nic

17 May 2012, 11:52 AM
#729
bridge32 avatar

bridge32

Zen Follower

Join Date:
Jun 2011
Posts:
145
Plugin Contributions:
0

Re: Support for CSS Flyout Menu

its ok found it!
And fixed it.
Many thanks
Nic

17 May 2012, 4:39 PM
#730
divavocals avatar

divavocals

Totally Zenned

Join Date:
Jan 2007
Location:
Los Angeles, California, United States
Posts:
10,011
Plugin Contributions:
3

Re: Support for CSS Flyout Menu

deleted

19 May 2012, 6:51 PM
#731
lat9 avatar

lat9

Administrator

Join Date:
Sep 2009
Location:
Stuart, FL
Posts:
14,067
Plugin Contributions:
56

Re: Support for CSS Flyout Menu

What a great plugin! I'm glad someone posted here; I've been looking for this functionality for a while.

10 Jun 2012, 2:38 PM
#732
thannaree avatar

thannaree

Zen Follower

Join Date:
Dec 2010
Location:
Thailand
Posts:
304
Plugin Contributions:
1

Re: Support for CSS Flyout Menu

Hi Get Em Fast,

I've installed this module and it works great! However, I have a slideshow on the homepage, which also uses jquery (namely 2 scripts: jscript_jquery.cycle.all.min and jscript_jquery-1.4.2.min) and the slideshow broke. I have removed the jscript_jquery that comes with this module and all works perfectly now. Is it okay to use it this way?

The site uses zencart 1.5 : http://goo.gl/wydFf

10 Jun 2012, 4:04 PM
#733
get_em_fast avatar

get_em_fast

Totally Zenned

Join Date:
Dec 2006
Location:
Seligman, MO U.S.A.
Posts:
2,072
Plugin Contributions:
1

Re: Support for CSS Flyout Menu

Yep, you can use it without jquery, and the menu will function just fine as pure css. BUT......................if you use Nivo-Slider as your image slider, they will work together just fine together.

10 Jun 2012, 4:14 PM
#734
thannaree avatar

thannaree

Zen Follower

Join Date:
Dec 2010
Location:
Thailand
Posts:
304
Plugin Contributions:
1

Re: Support for CSS Flyout Menu

Get Em Fast:

Yep, you can use it without jquery, and the menu will function just fine as pure css. BUT......................if you use Nivo-Slider as your image slider, they will work together just fine together.

Okay...and thanks!!

10 Jun 2012, 4:33 PM
#735
get_em_fast avatar

get_em_fast

Totally Zenned

Join Date:
Dec 2006
Location:
Seligman, MO U.S.A.
Posts:
2,072
Plugin Contributions:
1

Re: Support for CSS Flyout Menu

Not a problem. But, it looks like you've got both of them working together now. Looks good.

13 Jun 2012, 5:01 PM
#736
soso838 avatar

soso838

Zen Follower

Join Date:
May 2012
Posts:
105
Plugin Contributions:
0

Re: Support for CSS Flyout Menu

1.how to remove the word of "Categories" and take out :color:87ceeb area for CSS Flyout Menu 1.3.9 ,
I just want the flyout menu begin with the category item from "hardware, software.........
2.can I change the color between "the New Products...",and"Geatured Products..."

13 Jun 2012, 5:09 PM
#737
soso838 avatar

soso838

Zen Follower

Join Date:
May 2012
Posts:
105
Plugin Contributions:
0

Re: Support for CSS Flyout Menu

sorry I did not attached the picture
Attachment 10630

menu.jpg
13 Jun 2012, 11:01 PM
#738
get_em_fast avatar

get_em_fast

Totally Zenned

Join Date:
Dec 2006
Location:
Seligman, MO U.S.A.
Posts:
2,072
Plugin Contributions:
1

Re: Support for CSS Flyout Menu

Is this a "live" site? You got a URL for us?

6 Jul 2012, 11:14 AM
#739
kezan98 avatar

kezan98

Zen Follower

Join Date:
Nov 2007
Location:
UK
Posts:
98
Plugin Contributions:
0

Re: Support for CSS Flyout Menu

Love the mod, it goes a long way to doing what I'm trying to do. I'm trying to mimic the image with the main top categories showing along the bar and when someone hovers it show subcategories as individual headings with the next level of categories down showing directly under the heading.Attachment 10747

Any ideas?

Screen shot 2012-07-06 at 12.11.14.jpg
6 Jul 2012, 2:55 PM
#740
picandnix avatar

picandnix

Totally Zenned

Join Date:
Dec 2010
Location:
UK
Posts:
1,780
Plugin Contributions:
2

Re: Support for CSS Flyout Menu

kezan98:

Love the mod, it goes a long way to doing what I'm trying to do. I'm trying to mimic the image with the main top categories showing along the bar and when someone hovers it show subcategories as individual headings with the next level of categories down showing directly under the heading.Attachment 10747

Any ideas?

Try this http://www.zen-cart.com/downloads.php?do=file&id=323 if you haven't already?