Muse Mobile Website Problems (Scrolling and Menu Issues)

[ryana86909842]

Hello Adobe community,

Mobile website URL: www.salonkiklo.com

I found myself originally having problems with getting my menu item to stick to the top of the page when scrolling on the phone, similar to what it does for the computer website. I still cannot get this to work but I also have seen another problem when clicking on a menu item. It pushes my page off onto the left hand side of the screen on a mobile device. Even when not pushing on a menu button you can simply scroll the page to the left as well.

I have other websites and do not have problems like this. I am using anchors.

Please help, I really could use it.

- Ryan

[Günter Heißenbüttel · Accepted solution]

• Make sure, that neither on layout page nor on master page no visible or invisible element is outside/overlaps the page/breakpoint boundaries.
• Make sure, that the anchors you have placed are all vertically aligned at the left edge of your page. Because browsers try to position these anchor when scrolling to them in the upper left corner of the browser window, the page will shift, if they are placed somewhere on the page.

Besides that: Is it possible, you have build a weird mix of responsive design and an additional, adaptive phone page?

You can’t pin elements on phone pages, because most mobile browsers don’t support this.

What you can do: You can open the "Scroll Effects" panel, select "Motion", and set all values to "0". This has the same effect as pinning has. BUT: You can use scroll effects only, if you have a fixed width page.

You see: That is the point, you have to decide …

[ryana86909842]

Thank you, aligning the anchors solved this menu problem. It is unfortunate, though, that you cannot pin or keep a constant menu at the top of the page without manipulating the scroll effects.

I found that when I did change the scroll effects, it made aspects of my page either unresponsive, or positioned in a strange place.

- Ryan

[Günter Heißenbüttel]

Then you did something wrong. Of course, scroll effects need a fixed width page, because these effects have to rely on defined distances to the top of the page. This can't be the case on responsive pages. And the fact, that pinning is poorly supported by mobile devices in fixed width pages is not Muse's fault.

If you don't create different pages for different devices, but one responsive page with different breakpoints for the whole range (desktop to phone), pinning normally will be no problem.

[ryana86909842]

Yes Gunter I believe something went wrong somewhere I just have to figure out what. The mobile, and desktop both look nice, but they can be improved and I just need to figure out these improvements. Scroll, fixed, and responsive are all things I am learning now as this has created a problem here.

[Ussnorway]

thats not a bad desktop site but imo your layout still needs some more work

p.s, phones are not just small desktops... they have their own rules that change all the time and web design = adapt or die.

[ryana86909842]

Thank you and yes, also to credit Gunter's point, I believe my mistake was making the site too quickly. I literally copy, and pasted, everything from my main desktop design, over to the mobile site. Blindly thinking that it would reform, but perhaps, something, if not everything came over incorrectly.

I am not sure how to correct that IMO issue. If you have time could you please elaborate?

Thank you for the compliment on the site, I am still learning but am a fast learner.

- Ryan