Forums / Templates, Stylesheets, Page Layout / Can anyone help me on my category menu style? Thank you.

Can anyone help me on my category menu style? Thank you.

Started by mdivk on 21 Mar 2015, 11:56 AM · Views: 722

Results 1 to 7 of 7
21 Mar 2015, 11:56 AM
#1
mdivk avatar

mdivk

Zen Follower

Join Date:
Sep 2011
Location:
Toronto, Ontario, Canada
Posts:
290
Plugin Contributions:
0

Can anyone help me on my category menu style? Thank you.

I am not good at css at all, here is my demo shop.

I installed zen_cart_vertical_multi_level_slide_out_category_menu_1.1 to get a better category menu for my shop, here is thing I need to fix it:

If you hover to the category, and the category has sub cat, fine, but it will become invisible if it is in the slider area, you can see it for the first couple categories: hardware, software, etc.

How to make it always on the top?

Thank you very much.

21 Mar 2015, 12:19 PM
#2
rodg avatar

rodg

Deceased

Join Date:
Jan 2007
Location:
Australia
Posts:
6,263
Plugin Contributions:
4

Re: Can anyone help me on my category menu style? Thank you.

mdivk:

I am not good at css at all, here is my demo shop.

I installed zen_cart_vertical_multi_level_slide_out_category_menu_1.1 to get a better category menu for my shop, here is thing I need to fix it:

If you hover to the category, and the category has sub cat, fine, but it will become invisible if it is in the slider area, you can see it for the first couple categories: hardware, software, etc.

How to make it always on the top?

Thank you very much.

File: demo.webdesignstudiotoronto.com/slide-out-menu-new.css
Lines starting #34

.dhtmlgoodies_subMenu{
    /* visibility:hidden; */
    position:absolute;
    /* overflow:hidden; */
    border:0px solid #000;
    background-color:#FAFAFA;
    font-family:arial;
    text-align:left;
    [B]z-index: 99;[/B]
}

Add the line of code highlighted. Don't make any other changes.

Save the file and check.

Cheers
RodG

NOTE: We are sorry that Rod is no longer with us.
We are grateful for all his contributions to the Zen Cart community.

Ozpost - The Ultimate Shipping module for Australian Merchants. Click these links for its Homepage, or Download from Zen-Cart.com.

21 Mar 2015, 12:25 PM
#3
mdivk avatar

mdivk

Zen Follower

Join Date:
Sep 2011
Location:
Toronto, Ontario, Canada
Posts:
290
Plugin Contributions:
0

Re: Can anyone help me on my category menu style? Thank you.

Thank you Rod, is the fly out speed something adjustable?

21 Mar 2015, 12:28 PM
#4
mdivk avatar

mdivk

Zen Follower

Join Date:
Sep 2011
Location:
Toronto, Ontario, Canada
Posts:
290
Plugin Contributions:
0

Re: Can anyone help me on my category menu style? Thank you.

Just realized a big issue here:

This flyout style will not work on mobile devices!

Do you have any suggestion?

Thank you very much.

21 Mar 2015, 12:35 PM
#5
rodg avatar

rodg

Deceased

Join Date:
Jan 2007
Location:
Australia
Posts:
6,263
Plugin Contributions:
4

Re: Can anyone help me on my category menu style? Thank you.

mdivk:

Thank you Rod, is the fly out speed something adjustable?

Yes.
https://css-tricks.com/almanac/properties/t/transition-duration/

If you don't wanna do all that reading, add: "transition-duration: 1ms;" to the same piece of code as before (suggest just before the newly added z-index)

Cheers
RodG

NOTE: We are sorry that Rod is no longer with us.
We are grateful for all his contributions to the Zen Cart community.

Ozpost - The Ultimate Shipping module for Australian Merchants. Click these links for its Homepage, or Download from Zen-Cart.com.

21 Mar 2015, 12:41 PM
#6
rodg avatar

rodg

Deceased

Join Date:
Jan 2007
Location:
Australia
Posts:
6,263
Plugin Contributions:
4

Re: Can anyone help me on my category menu style? Thank you.

mdivk:

Just realized a big issue here:

This flyout style will not work on mobile devices!

Do you have any suggestion?

Thank you very much.

You are using a responsive template so it should be showing differently on mobile devices anyway.

It may be worthwhile taking a look at this for further tips.
http://www.w3schools.com/cssref/css3_pr_mediaquery.asp

Cheers
RodG

NOTE: We are sorry that Rod is no longer with us.
We are grateful for all his contributions to the Zen Cart community.

Ozpost - The Ultimate Shipping module for Australian Merchants. Click these links for its Homepage, or Download from Zen-Cart.com.

21 Mar 2015, 1:20 PM
#7
mdivk avatar

mdivk

Zen Follower

Join Date:
Sep 2011
Location:
Toronto, Ontario, Canada
Posts:
290
Plugin Contributions:
0

Re: Can anyone help me on my category menu style? Thank you.

Thanks Rod.

Have a good weekend.