Highlighted

Mobile menu Phone Layout Scroll Effect Issue

New Here ,
Feb 26, 2019

Copy link to clipboard

Copied

Hello,

I tried to pin my header with menu in phone layout using scroll effect giving 0 to all parameters. When i make page preview in browser with mobile setups in developper tools everithing works fine, but when i open it on mobile phone (iPhone 6s, Meizu M2 Note) my header and menu button disappear.

Any help?

Site: videographer.lv

Thanks in advance.

Views

274

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Mobile menu Phone Layout Scroll Effect Issue

New Here ,
Feb 26, 2019

Copy link to clipboard

Copied

Hello,

I tried to pin my header with menu in phone layout using scroll effect giving 0 to all parameters. When i make page preview in browser with mobile setups in developper tools everithing works fine, but when i open it on mobile phone (iPhone 6s, Meizu M2 Note) my header and menu button disappear.

Any help?

Site: videographer.lv

Thanks in advance.

Views

275

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Feb 26, 2019 0
Adobe Community Professional ,
Feb 26, 2019

Copy link to clipboard

Copied

I don`t even see a header at the start position, is that true to you, too?

To inspect we would need a phone version only - please reduce your muse to only one page with only the phone version and share it with us via CC or dropbox or similar filesharing.

I recommend not to use adaptive design but instead responsive design. As you go with fixed width breakpoints (scroll motion is only available with fixed width breakpoints), this should be not problem, I hope?

Kind Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Feb 26, 2019 0
New Here ,
Feb 26, 2019

Copy link to clipboard

Copied

"I don`t even see a header at the start position, is that true to you, too?"

This is exactly the problem, he is there.

"As you go with fixed width breakpoints (scroll motion is only available with fixed width breakpoints), this should be not problem, I hope?"

There is a problem, when i go with fixed width scroll motion my header and menu disappear.

Here is my site-mobile version only:

Dropbox - Test_mobile.zip

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Feb 26, 2019 0
Adobe Community Professional ,
Feb 26, 2019

Copy link to clipboard

Copied

Bildschirmfoto 2019-02-26 um 18.32.09.png

Of course this will not work as you setup fluid width "breakpoint". I recommend to go with 320 only fixed width and it should work as intended. Wit 380 it looks like this and works as expected:

Bildschirmfoto 2019-02-26 um 18.34.39.png

Kind Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Feb 26, 2019 0
New Here ,
Feb 26, 2019

Copy link to clipboard

Copied

Yes sorry, i sent you file with wrongs page settings. But i updated it as you said, and i have still nothing in my mobile browser :Screen Shot 2019-02-26 at 19.49.30.png

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Feb 26, 2019 0
LEGEND ,
Feb 26, 2019

Copy link to clipboard

Copied

As fotoroeder​ said: Your master page has a fixed width breakpoint at 380 px – what is correct.

Your layout page has a fluid width breakpoint at 380 px. This can’t work correctly in adaptive layout.

Solution:

Set the breakpoint of your layout page to 380 px fixed width by right clicking onto the breakpoint icon and deselecting „fluid width“:

Screen_01.jpg

Now almost everything should work as expected – with one restriction:

Never use system font on web sites! Or in other words: Never use system font on web sites! The „T“ icon clearly shows, that you did it. Why shouldn’t you do this? Please read post 4 here: https://forums.adobe.com/thread/2357163

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Feb 26, 2019 1
New Here ,
Feb 27, 2019

Copy link to clipboard

Copied

Thank you so much! Now its working.

I thought when you change properties for master page it affects all layout pages automatically.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Feb 27, 2019 0
Adobe Community Professional ,
Feb 27, 2019

Copy link to clipboard

Copied

No, you can have different settings for master and layout/content pages. Some times it helps, sometimes it leads to mismatch on designers sides. Glad, that it is working for you now

Kind Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Feb 27, 2019 0
Adobe Community Professional ,
Feb 27, 2019

Copy link to clipboard

Copied

Watching your first example, I was working on, there the master page was set to fixed width, that´s why it worked on my side but not on yours.

Kind Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Feb 27, 2019 0