Horizontal scroll bar on welcome page only - responsive-design

I tried body {overflow: hidden} trick but it hides everything below "View Details and Buy" button. Checked the elements through Inspector and none seem to overflow. I can't exactly point out the issue. Same template is used for other pages and those are working fine.
Getting the scroll bar on this page:
http://www.satyatunes.com/web/index.php
The same template is used on this but it's working fine:
http://www.satyatunes.com/web/store.php
The welcome page is not responsive on mobile/ipads also.

Related

Why is the pinned content of my scrolltrigger disappearing (Locomotive Scroll)

My slider component disappears when it should pin to the page. I believe it is related to the page scroll with Locomotive scroll messing up with translating the page. However, this should be possible and I found a tutorial by Greensock. I cannot get it to work though, my content keeps disappearing. Here is a minimal demo: https://codesandbox.io/s/cool-noyce-108h6c?file=/pages/index.tsx
Here is also a link to the final webpage: https://juliaweber-git-preview-inzn.vercel.app
Any help is greatly appreciated!

Is there some way to navigate along side sections in this Scroll Area?

Can some one give me any advice, how can i solve problem with navigation in the scollable area from react drei (https://www.npmjs.com/package/#react-three/drei) tools in front of Canvas 3D background. When i am trying use common navigation between sections with section id="hero" and Banner area. It is working, but scroll area working is scrolling my content with css property translate: translate3d(...). So if i use my tag with section id. It scrolls to the given id but than i am not able to scroll back to the upper sections.
Here is my code:
I was expectig regular behavior of tag navigation

Mobile browser bug: when top bar is visible, menu links don't work well

For screen max-width: 479.98px menu has width: 100%; and body has class .lock {overflow: hidden;}. When menu is collapsed, class .lock is removed. It works well when I test it on small screen simulator on my PC, but on mobile I found a bug: if top bar of mobile browser is visible, there is no following the menu link, while menu collapses as it should, and I see the anchor at the url. But if browser top bar is hidden, everything works fine! And there is no problem for wider screens, with no overflow: hidden for body.
Tob bar visible, no links following. screen 1
Tob bar hidden, no problem. screen 2
Code: https://github.com/randominical/transys_demonstration
Demonstration: https://randominical.github.io/transys_demonstration/ To see the problem open it on mobile not bigger then 479px!
UPD: I'm nor sure anymore that the point is about the screen width. First of all, please test if you see the bug on your device.

Hide slide-menu/nav bar

Still learning ionic. I have a slide menu integrated into the app. The problem that I have is that I want to completely hide ionic nav bar and menu on top for my login view. I tried using ng-show to hide the nav bar based on whether or not current user is authenticated, but all it does is hide the content in the bar, but leaves empty nav bar container on top of the page.
I also tried using ng-if instead of ng-show, which does make the bar disappear completely, but when I need it to become visible again, the code produces an error: Cannot read property 'outerHtml' of null. I guess because the DOM object for the menu is not there anymore.
What is the best way to address this? Am I on the right path or is there a better way to show/hide

IE7 : <ul> disappearing on hover

Having a very strange IE7 issue that I cannot find a fix for. I have created a slideshow with a control nav absolutely positioned at the bottom of it. The nav sits over the slideshows bottom border.
In ie7, hovering over it cause the nav to jump behind the border and hence the top of it disappears. I don't have a clue what is happening and cannot find solutions elsewhere. Here is a link demonstrating the issue:
http://rivaslider.matthewruddy.com/
Anyone have a solution? Pulling my hair out.

Resources