BX Slider and scrolling the page - mobile

I am using bxslider for a mobile site, horizontally scrolling images. The problem is that page is not scrolling if you touch bxslider. How can I catch the finger direction and scroll the page down ? thanks.

You can set the option touchEnabled to false.

Related

prevent scroll on body when disclosure panel is open

I'm using headless uis Disclosure to open a sidemenu. In a <Disclosure.Panel> I use "overflow-auto" to enable scrolling in the menu. However I want to disable the scroll on Body when I do this since otherwise I have two scrollbars for the y axis. Any tips on how to achieve this?
Yes! Target the <body> or <html> element on the page and add overflow: hidden to prevent scrolling on the X or Y axis. You can do this with a class and toggle the class on when the panel is open and off when its closed to allow scrolling again.
Hope this helps!

Smooth scroll (locomotive scroll) and scroll triggered animation (framer motion + react-intersection-observer) bug

How can we make smooth scroll from locomotive scroll and scroll triggered animations (with framer motion and react-intersection-observer) coexist ?
I've made a very basic codesandbox with smooth scroll enabled and a small animation scroll triggered and as you can see the animation is very "buggy" (to see it, you have to open the codesandbox browser in a new window, if not, the smooth scroll doesn't work - and the animations works fine) :
https://codesandbox.io/s/smooth-scroll-framer-motion-8z5u8s?file=/src/App.js
Maybe I implemented locomotive scroll in a bad way ? Maybe I did something wrong with the animation ? Maybe it's simply impossible ? You tell me :)
Cheers

Vertical carousel on scroll reactjs

I want to have a section of the website which is fixed while to slide the carousel on scroll (vertically). Once you are at the last slide the scroll will let you continue on the page instead of changing the slide of the carousel. No idea on how to do this
row with a different background color which remain fixed while the user slides through the carousel slides by scrolling the page. once we arrive on the last slide the scroll will do the usual function on the page

Grid panel vertical scrollbar issue after refresh

We are having a grid panel which refreshes every 20 seconds (getView().refresh()).
After refresh, the scrollbar loses position and the screen moves up and down. Also, a blank screen is displayed whenever the scrollbar is used and if the refresh happens at the same time. This is happening in both IE and Firefox.
Cellediting plugin is turned on in the grid panel.
Tried different options like preserveScrollerOnRefresh, listeners on beforerefresh, refresh to maintain scroll position, Ext.empty function...etc, but nothing seems to work.
Can anyone please reply on this?
I tried this option but didn't work. I get a blank screen on scroll during refresh or the scrollbar jumps to any position after refresh

How to align Angular Multiselect from the bottom

I am looking for align the Angular Multiselect from the bottom.
Problem is activating that dropdown will display it beneath the clickable trigger, no matter where on the screen it is. If the trigger is at the very bottom of the page, when clicked the dropdown will increase the page height, and the user will have to scroll down again to see the rest of the dropdown
code link
Thanks.
There is a dropup feature in bootstrap.
Referece: http://getbootstrap.com/components/#btn-dropdowns-dropup

Resources