I have a website built in Elementor with snap scroll which is setup to align to the top of section.
Everything works fine when I scroll on desktop using mouse scroll button or on mobile using finger.
However, on mobile, when I click any of the buttons with a reference to sections the snap scroll aligns to the bottom of that section and from that point snap scroll always aligns to the bottom of a section unless I reload page.
I tried to change it by applying css to the button or section element but it doesn't work.
scroll-snap-align: start;
Elementor says that it is an unknown property. I also tried.
scroll-snap-align: top;
I also tried to change a setting inside Elementor for snap scroll to align to a top, but it doesn't seem to work for buttons.
Lastly, I tried adding a padding setting inside Elementor, but it also didn't fix the problem.
Related
I'm setting up a new page. In the CFM after /head, I have a /body and then a /div for my full page background followed by various forms and tables. Using CSS, I have moved said forms and tables up the page so that nothing extends beyond the bottom of the vertical scroll bar which is 1/3 up from the page bottom. When I scroll down, the background moves up and there is nothing to see and when I use Firefox Inspector, the only things extending beyond the scroll bar is html and body. Their css setting are "height: 100%;". So, why the scroll bar? ps. I'm pretty new to this....
I have a UINavigationBar that is configured to Hide Bars on Swipe. The Nav bar hides when I scroll down, but does not reappear when I scroll upward. I have to tap to get the Nav bar to reappear. All views in this VC are configured via Auto Layout (no code).
I've solved this. My scroll view was pinned to the top and bottom layout guide. I pinned it to the top and bottom superview, and the Nav Bar's behavior was corrected.
Thanks!
I'm working on a site which uses pure CSS and hover states to build the drop-menu. The problem is that the number of navigation items are so many that the a user has to scroll to see it on smaller laptops. But what happens is the menu disappears before reaching the bottom as if a mouseout event has occurred. Is there a way to prevent this without having to convert the menu to javascript/jQuery?
http://spinov8.com/SNS_demo/shop
Your dropdown seems to disappear with the rest of your navigation when you scroll down, as soon as you scroll upwards it reappears with your dropdown already open.
I removed the jquery that was making it disappear on scroll down and reappear on scroll up so that it remains fixed.
I'm trying to enable browser scroll bar in my website but didn't work.
This is the site online : http://guillaumeruiz.com
All projects in this "gallery" are hidden and visible with a hide Id function. I used a left-right-top-bottom fixed divs for the red window border. And, every div project have a fixed position too to cover the main gallery.
If you can help me please... thank you
I have a problem related with the css 'top' attribute of a Foundation modal.
I have long list of anchors and when I click in each anchor, a modal is opened. I have the css top attibute set to 100px.
When I use Chrome, even if I am in the bottom of the list and I click in one of the last anchors, my modal appears always at 100px of the top of the screen, i.e at 6356px of the top of the body. However, using Firefox, when I click in one of these last anchors, my modal appears at 100px of the top of the body, so I have to scroll up to see the modal. What can I do to make Firefox behave like Chrome?