Remove images from only the mobile menu

You are here

Home » Forums » Module Support » Mega menu
geethal2's picture
geethal2
Wed, 02/13/2019 - 05:31
#1
Remove images from only the mobile menu

Hi,

This is my web site. https://www.mrt.ac.lk In my mega menu, I have added some images. I have a requirement that I want to remove those images only from the mobile menu. For people who uses the desktop, displaying the images is not an issue. But for the peole who uses the mobile, it is not convenient. Please help me.

Thanks

cindy's picture
cindy
Wed, 02/13/2019 - 23:53

Hello

Please add the following custom css in file style of your front end theme to fix megamenu problem on mobile

+ replace 1000px with the screen size that image will be hidden, ex: 768px

+ replace #header-top-full .awemenu-nav .awe-block img with id/class of the image will want to hide ( inspect on chrome to find id/class)

@media only screen and (max-width: 1000px) {
 #header-top-full .awemenu-nav .awe-block img{
   display: none;
 }
}

+ screen size > 1000px : show image

http://prntscr.com/mkuvpy

+ screen size <= 1000px : hide image

http://prntscr.com/mkuw1g

geethal2's picture
geethal2
Thu, 02/14/2019 - 02:29

Thank you for the help

Log in or register to post comments
Have More Idea?

We are here to build your website!

No Universal solution fits all special business requirements. Our experienced team is ready with ideas and state-of-the-art technical solutions to consult the best solution within your budget.

See Our Services

Welcome back, Buddy!

Forgot password