Jump to content

[SOLVED] Top menu do'nt expand on iPad in Portrait


Recommended Posts

I have looked all most every inch through in Chrome console, to find the bug.

I also have searched google empty for informations regarding this problem.

 

I can't find any error, so I hope there's someone here there could help me.

 

The site is: https://shop.hjortsmykker.dk and the problem occurs only when the screen width = 768.

I have tried to tweak some .css and some .js, but I ending up restore old values.

 

Hope for help

Regards, Leif B.

Edited by OYLSB ~ Leif B. (see edit history)
Link to comment
Share on other sites

 

Please refer to the attached screenshot for fixing the design glitch.
 
You might need to disable the 'Smart Cache for CSS' setting from the Performance tab to view the path of file responsible for this CSS.

 

Thank you for taking the time.

I tried to disable:

@media (max-width: 768px)
.sf-menu {
    display: none;
}

But then the menu expanded and could not collapse :-( 

It's like that the click event on the menu, are conflicting, when the screen width is 768px.

 

/Leif B.

Link to comment
Share on other sites

Finally I got it to work!!

 

I changed \themes\[themename]\js\modules\blocktopmenu\js\blocktopmenu.js

// check resolution
function responsiveMenu()
{
   if ($(document).width() <= 767 && responsiveflagMenu == false)
	{
		menuChange('enable');
		responsiveflagMenu = true;
	}
	else if ($(document).width() >= 768)
	{
		menuChange('disable');
		responsiveflagMenu = false;
	}
}

to

// check resolution
function responsiveMenu()
{
   if ($(document).width() <= 768 && responsiveflagMenu == false)
	{
		menuChange('enable');
		responsiveflagMenu = true;
	}
	else if ($(document).width() >= 769)
	{
		menuChange('disable');
		responsiveflagMenu = false;
	}
}

Link to comment
Share on other sites

  • 1 month later...

Thanks for posting this. It was easier for me to find what file i had to modify. If you want to expand this to higher resolution than you can modify(in blocktopmenu.js) the "767" and "768" to let`s say "991" and "992"

 

Also in superfish-modified.css(themes/YOUR-THEME/css/modules/blocktopmenu/css) you have to change "767px" and "768px" to "991px" and "992px"

Link to comment
Share on other sites

  • 1 year later...

Hello, sorry disturbing,

I'm experiencing this same problem in prestashop 1.7.3.1 but the menu and the othe files are not present in the new release... please would you like to help me, i nee to activate responsive modality at 800px.

 

Thnak you so much for your help

Link to comment
Share on other sites

  • 5 weeks later...
On 01/05/2018 at 10:20 PM, gaziana said:

Hello, sorry disturbing,

I'm experiencing this same problem in prestashop 1.7.3.1 but the menu and the othe files are not present in the new release... please would you like to help me, i nee to activate responsive modality at 800px.

 

Thnak you so much for your help

Hi ! Have you find a soluce ?

Link to comment
Share on other sites

30 minutes ago, YvanM said:

Hi ! Have you find a soluce ?

hello, I had to modify the responsive.js file of my custom theme, you should modifiy the media queries of the specifica screen resolution in your responsive.js files and css files, but it dependso from your theme, I've spent a lot of time on my theme folder to understand wich file it was to be modified.

Link to comment
Share on other sites

  • 1 year later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...