Page flickering on Chrome (mobile version) - twitter-bootstrap-3

I noticed that often when I scroll my bootstrap-page through chrome (mobile version), some parts freeze and other one scroll over and the effect is like image flickering.
I checked on my tablet (samsung galaxy tab 2) and on a friend's galaxy note.
Chrome browser is updated to current version!
For example I can get this effect scrolling down also the bootstrap documentation page like as http://getbootstrap.com/getting-started/
Why does it happen? Did you aware same issue?
Is it a chrome bug? Can I fix it through code?
Thanks a lot!

You can avoid the flickering by using this at the beginning of CSS
*{
-webkit-backface-visibility:hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
-o-backface-visibility:hidden;
backface-visibility:hidden;
}

Related

Safari 12.2 Scrolling

Has anyone experienced infinite scrolling issue in safari 12.2? As well as positioning using flexbox?
jQuery is used to trigger data fetching when scrollbar reaches the bottom. It does function but buggy at times.
In terms of positioning, i have tried using floating a button to the right, flexbox but I ended up using tables because it doesn't position itself to the right like newer version of safari.

How to stop flickity from jumping in mobile viewport

I am using the Flickity slider (from Metafizzy) in a landing page to show different products. The slider is in portrait size and not landscape.
The issue is that when the user only scrolls the top portion of the slider into the viewport on mobile (i.e. 20-30%) and they attempt to scroll/swipe the slide, the screen suddenly jumps to attempt to include the whole slider into the viewport.
This never happens on the mobile emulator on the desktop, but only on the smartphone device on safari and google chrome browsers
Is this intended to be a specific behaviour for the Flickity slider? Like I should not be using it to make portrait sliders? I've gone through the plugin options and not able to fix this behaviour. It never came up in early testing with dummy content.
I've provided a link to the github page where it is happening, you can open it up in mobile browser and see the viewport "jumping" bug when you attempt to scroll the table. https://true-digital-channel.github.io/Galaxy11-Preorder/build/mobile.html
Disable the keyboard accessibility by setting accessibility: false in the carousel options. From the Flickity issue tracker.

Famo.us browser scroll emulation does not feel natural

I am creating a site in pure Famo.us, I wanted to have 1 page with sections where the user has possibility either click on links and scroll to anchors or scroll sequentially to get to sections. I used initially famo.us scrollview, but its behavior was not was not similar to browser scroll - I tried many options. I implemented my own scroll with Scrollsync, modifier and transition but it still does not feel similar to browser scroll. But the main problem that on Laptop and Desktop PC - I need to set different scrollscale to function normally. Here is the app:
https://svet15.herokuapp.com/
Can anybody give a direction to solve the problem with syncscale and maybe how to make scroll similar to browser native scroll.
P.S. I keep mobile view separately from desktop, so window.width should be more than 500 to see the desktop view where I have this problem. Thank you in advance!

Parallax Scrolling is Choppy in Safari only

I currently am working with a web company who has coded most of my website. They are about to hand the site off to me however there is an issue with the parallax scrolling in Safari; Works great in all other browsers. Also, I have a widget on the left side of the page that is affected as well. Very choppy when scrolling vertically. Any suggestions and help is greatly appreciated. Here is the link to the site:
http://zerochroma.nclud.me/product/vario-protect-iphone-4-4s
The issue seems to be in safari only.

Grid Scrollbar not working on I-pad

I am using ExtJS 4.0.7
I have grid on my page. If there is too much data scrollbar automatically comes, in Chrome, Mozilla IE even on Safari as well.
But when I try to access the same application in I-pad , scroll bar are not working.
Note:- Grids reast fetures i.e. pagination etc are working fine. Only scrollbar are not working.
Is there any specific reason for this ?
This is a known problem with Ext 4.0; it uses virtual scroller for grids and it's completely broken on touch devices. Ext JS 4.1 solves this problem and scrolling works on iPads, although scrollbars are not displayed.