X-Cart: shopping cart software
Page 1 of 2 1 2 >
Show 40 posts from this thread on one page

X-Cart forums (https://forum.x-cart.com/index.php)
-   Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)
-   -   Fancy_Cat menu flying out under central block (https://forum.x-cart.com/showthread.php?t=51404)

just_me 12-18-2009 10:42 AM
Fancy_Cat menu flying out under central block
 
I just installed the fancy categories flyout menu. It looks great everywhere except on the home.php page. It flys out"under" the central block. Anybody know what css I need to fix or is the problem elsewhere?

cflsystems 12-18-2009 12:29 PM
Re: Fancy_Cat menu flying out under central block
 
Does this happen in all browsers or IE only? You may ned to apply z-index property on parent element and menu to get it to show on top of all elements

just_me 12-22-2009 03:48 AM
Re: Fancy_Cat menu flying out under central block
 
Yes, that worked. I put a z-index: 1; and all is well. Sometimes the fix is easy. Thanks! :P

chudnovsky 05-15-2010 01:33 AM
Re: Fancy_Cat menu flying out under central block
 
Hi,
Can you please tell me where you found the location to place the z-index for the menu , for the life of me I can't find where to add the z-index.

Thanks very much :-)

Cheers,
Alex

just_me 05-21-2010 02:12 PM
Re: Fancy_Cat menu flying out under central block
 
Heh, it's been a while since I did that but here's where I have set z-index 1 in my css for category menus


Code:
.fancycat-icons-scheme li:hover ul,
  .fancycat-icons-scheme li.over ul
{
  display: block;
  overflow: visible;
  z-index: 1;
}


.menu-fancy-categories-list .content {
  overflow: visible;
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 6px;
  z-index: 1;
}

Hope that helps. If not, let me know and I'll take a closer look on Monday.

Have a nice weekend.
8)

gatordp 08-07-2010 08:51 PM
Re: Fancy_Cat menu flying out under central block
 
I am having this same problem. The flyout is underneath the main content blocks so you cannot see the category titles.

I tried adding a z-index:1; in the two places shown above by just_me in the main.css for Fancy Category.

Any ideas? I'm trying in both Firefox and IE

cflsystems 08-07-2010 10:26 PM
Re: Fancy_Cat menu flying out under central block
 
It may be the overflow property of the parent containers
url would help to be more specific

mtputer.com 08-18-2010 03:07 PM
Re: Fancy_Cat menu flying out under central block
 
I am having the same issue with v4.4 testing and I am unable to find the correct reference in any of the css. I have looked in the common files--> modules--> flyouts--> main.css and could not find anything that worked by changing the z-index and overflow. I also looked in the skin I am using: Vivid Dreams Violet-->css-->altskin.css. Can anyone lend a hand? I am feeling a little lost in v4.4.

Thanks,

Jeff

gatordp 09-07-2010 02:59 AM
Re: Fancy_Cat menu flying out under central block
 
Quote:
Originally Posted by cflsystems
It may be the overflow property of the parent containers
url would help to be more specific

Here is my main.css for the Fancy Category module - I still can't get the Category to display on top of the central block. I set all the overflow properties to 'visible'


Code:
/*
$Id: main.css,v 1.7 2008/12/02 13:14:12 max Exp $
vim: set ts=2 sw=2 sts=2 et:
*/
/* Layout */
.menu-fancy-categories-list .content {
  overflow: visible;
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 6px;
  z-index: 1;
}
.fancycat-icons-scheme ul {
  list-style-type: none;
  padding: 0px;
  margin: 0px;
  list-style: none;
  width: 137px;
}
.fancycat-icons-scheme ul li {
  float: left;
  position: relative;
  width: 100%;
  padding: 2px 0px;
  background: white none;
}
.fancycat-icons-scheme li ul {
  display: none;
  position: absolute;
  top: 4px;
  left: 126px;
  background: white none;
  border: 1px solid #b1c6d7;
  margin: 0px;
  padding: 5px 6px 5px 5px;
}
.fancycat-icons-scheme li:hover,
  .fancycat-icons-scheme li.over
{
  background-color: #e4e7ed;
}
.fancycat-icons-scheme li:hover ul,
  .fancycat-icons-scheme li.over ul
{
  display: block;
  overflow: visible;
  z-index: 1;
}
/* multi-level support */
.fancycat-icons-scheme li:hover ul ul, .fancycat-icons-scheme li.over ul ul,
  .fancycat-icons-scheme li:hover ul ul ul, .fancycat-icons-scheme li.over ul ul ul,
  .fancycat-icons-scheme li:hover ul ul ul ul, .fancycat-icons-scheme li.over ul ul ul ul,
  .fancycat-icons-scheme li:hover ul ul ul ul ul, .fancycat-icons-scheme li.over ul ul ul ul ul,
  .fancycat-icons-scheme li:hover ul ul ul ul ul ul, .fancycat-icons-scheme li.over ul ul ul ul ul ul,
  .fancycat-icons-scheme li:hover ul ul ul ul ul ul ul, .fancycat-icons-scheme li.over ul ul ul ul ul ul ul,
  .fancycat-icons-scheme li:hover ul ul ul ul ul ul ul ul, .fancycat-icons-scheme li.over ul ul ul ul ul ul ul ul,
  .fancycat-icons-scheme li:hover ul ul ul ul ul ul ul ul ul, .fancycat-icons-scheme li.over ul ul ul ul ul ul ul ul ul,
  .fancycat-icons-scheme li:hover ul ul ul ul ul ul ul ul ul ul, .fancycat-icons-scheme li.over ul ul ul ul ul ul ul ul ul ul,
  .fancycat-icons-scheme li:hover ul ul ul ul ul ul ul ul ul ul ul, .fancycat-icons-scheme li.over ul ul ul ul ul ul ul ul ul ul ul
{
  display: none;
}
.fancycat-icons-scheme li li:hover ul, .fancycat-icons-scheme li li.over ul,
  .fancycat-icons-scheme li li li:hover ul, .fancycat-icons-scheme li li li.over ul,
  .fancycat-icons-scheme li li li li:hover ul, .fancycat-icons-scheme li li li li.over ul,
  .fancycat-icons-scheme li li li li li:hover ul, .fancycat-icons-scheme li li li li li.over ul,
  .fancycat-icons-scheme li li li li li li:hover ul, .fancycat-icons-scheme li li li li li li.over ul,
  .fancycat-icons-scheme li li li li li li li:hover ul, .fancycat-icons-scheme li li li li li li li.over ul,
  .fancycat-icons-scheme li li li li li li li li:hover ul, .fancycat-icons-scheme li li li li li li li li.over ul,
  .fancycat-icons-scheme li li li li li li li li li:hover ul, .fancycat-icons-scheme li li li li li li li li li.over ul,
  .fancycat-icons-scheme li li li li li li li li li li:hover ul, .fancycat-icons-scheme li li li li li li li li li li.over ul,
  .fancycat-icons-scheme li li li li li li li li li li li:hover ul, .fancycat-icons-scheme li li li li li li li li li li li.over ul
{
  display: block;
  overflow: visible;
  z-index: 1;
}
/* Visual scheme */
.fancycat-icons-scheme ul li a:link,
  .fancycat-icons-scheme ul li a:visited,
  .fancycat-icons-scheme ul li a:hover,
  .fancycat-icons-scheme ul li a:active
{
  display: block;
  position: relative;
  font-size: 12px;
  color: #330000;
  text-decoration: none;
  line-height: 16px;
  vertical-align: middle;
  background: transparent none;
  padding: 0px 25px 0px 0px;
  overflow: visible;
}
.fancycat-icons-scheme a.icon-link:link,
  .fancycat-icons-scheme a.icon-link:visited,
  .fancycat-icons-scheme a.icon-link:hover,
  .fancycat-icons-scheme a.icon-link:active
{
  padding-left: 26px;
}
.fancycat-icons-scheme a.sub-link:link,
  .fancycat-icons-scheme a.sub-link:visited,
  .fancycat-icons-scheme a.sub-link:hover,
  .fancycat-icons-scheme a.sub-link:active
{
  background: transparent url(tree_subdir_plus.gif) no-repeat 97% 4px;
}
.fancycat-icons-scheme a.empty-link:link,
  .fancycat-icons-scheme a.empty-link:visited,
  .fancycat-icons-scheme a.empty-link:hover,
  .fancycat-icons-scheme a.empty-link:active
{
  color: #a3b1c7;
}
.fancycat-icons-scheme a.nowrap-link:link,
  .fancycat-icons-scheme a.nowrap-link:visited,
  .fancycat-icons-scheme a.nowrap-link:hover,
  .fancycat-icons-scheme a.nowrap-link:active
{
  white-space: nowrap;
}
.fancycat-icons-scheme img {
  width: 16px;
  height: 16px;
  position: absolute;
  top: 0px;
  left: 0px;
  padding: 0px;
  margin: 0px;
}

gatordp 10-12-2010 02:33 AM
Re: Fancy_Cat menu flying out under central block
 
I just wanted to bump this to see if anyone could help me fix my CSS (above) so the flyout works properly.

Thanks


All times are GMT -8. The time now is 03:40 AM.
Page 1 of 2 1 2 >
Show 40 posts from this thread on one page

Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.