Follow us on Twitter X-Cart on Facebook Wiki
Shopping cart software Solutions for online shops and malls

Sidebar CSS Flyout Menu

 
Reply
   X-Cart forums > X-Cart 5 > Modifying the design and features (X-Cart 5)
 
Thread Tools Search this Thread
  #1  
Old 03-04-2020, 08:39 AM
 
Dawn Howard Dawn Howard is offline
 

Senior Member
  
Join Date: Apr 2006
Posts: 184
 

Default Sidebar CSS Flyout Menu

I'm having a hard time getting my sidebar menu to have the same hover effect as my top menu.

Here is the CSS I used:
.flyout-menu > li > a:hover,
.flyout-menu > li > a:focus {
color: #F4EFE7;
background-color: #00244D;
}

.flyout-menu > .active > a,
.flyout-menu > .active > a:hover,
.flyout-menu > .active > a:focus {
color: #F4EFE7;
background-color: #00244D;
}

The background color changes, but the li and text color does not.

https://test.duffystric.com/
__________________
Dawn
X-Cart Business 5.3.6.3 - Testing Phase
Mods:
Order Forms - Custom Mod
Freight on Board - Custom Mod
Catalog Order Form
Call For Price
Template: Crisp White skin

X-Cart 4.4.3 Gold - Live Store


Running on Windows
Reply With Quote
  #2  
Old 03-05-2020, 12:09 AM
 
Ed B. Ed B. is offline
 

eXpert
  
Join Date: Apr 2016
Posts: 293
 

Default Re: Sidebar CSS Flyout Menu

Which template are you using?
__________________
X-cart 5.2.12, php 5.6
Ed from Grenoble, France
Reply With Quote
  #3  
Old 03-05-2020, 06:36 AM
 
Dawn Howard Dawn Howard is offline
 

Senior Member
  
Join Date: Apr 2006
Posts: 184
 

Default Re: Sidebar CSS Flyout Menu

Crisp White skin
__________________
Dawn
X-Cart Business 5.3.6.3 - Testing Phase
Mods:
Order Forms - Custom Mod
Freight on Board - Custom Mod
Catalog Order Form
Call For Price
Template: Crisp White skin

X-Cart 4.4.3 Gold - Live Store


Running on Windows
Reply With Quote
  #4  
Old 03-05-2020, 10:15 AM
 
Ed B. Ed B. is offline
 

eXpert
  
Join Date: Apr 2016
Posts: 293
 

Default Re: Sidebar CSS Flyout Menu

Oh, sorry, it was in the signature...


I tested and a strange thing happened. I edited custom css, and your css code actually worked both for the background color and text color. However, when I switched to another page, none worked... (x-cart 5.4.0.10 with crispy white skin). I am afraid this doesn't help you much...
__________________
X-cart 5.2.12, php 5.6
Ed from Grenoble, France
Reply With Quote

The following user thanks Ed B. for this useful post:
Dawn Howard (03-09-2020)
  #5  
Old 03-05-2020, 10:52 PM
 
memoto memoto is online now
 

X-Cart team
  
Join Date: Feb 2018
Posts: 130
 

Default Re: Sidebar CSS Flyout Menu

Mostly like you used very specific classes that were changed once a new page was loaded. I would recommend checking same sections on different pages. It is possible that some additional steps could be added there.

E.g. WAS: .flyout-menu > .active > a BECAME: .flyout-menu > .div > .li > .active > a

etc.
__________________
support engineer
Reply With Quote
  #6  
Old 03-09-2020, 06:57 AM
 
Dawn Howard Dawn Howard is offline
 

Senior Member
  
Join Date: Apr 2006
Posts: 184
 

Default Re: Sidebar CSS Flyout Menu

Thanks, but I don't understand what I should change.


Here is the CSS I used:
.flyout-menu > li > a:hover,
.flyout-menu > li > a:focus {
color: #F4EFE7;
background-color: #00244D;
}

.flyout-menu > .active > a,
.flyout-menu > .active > a:hover,
.flyout-menu > .active > a:focus {
color: #F4EFE7;
background-color: #00244D;
}
__________________
Dawn
X-Cart Business 5.3.6.3 - Testing Phase
Mods:
Order Forms - Custom Mod
Freight on Board - Custom Mod
Catalog Order Form
Call For Price
Template: Crisp White skin

X-Cart 4.4.3 Gold - Live Store


Running on Windows
Reply With Quote
  #7  
Old 03-12-2020, 01:54 PM
 
memoto memoto is online now
 

X-Cart team
  
Join Date: Feb 2018
Posts: 130
 

Default Re: Sidebar CSS Flyout Menu

It's impossible to say what you should change as almost every template has a different structure. I would recommend checking them with the browser devtools to see how blocks are constructed.
__________________
support engineer
Reply With Quote
Reply
   X-Cart forums > X-Cart 5 > Modifying the design and features (X-Cart 5)


Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT -8. The time now is 05:27 AM.

   

 
X-Cart forums © 2001-2020