1

I realized that those styles, where JavaScript controls the values depending on scroll, aren't work. for an example:

var elem
window.onscroll = function (elem){
    (function change(){
      elem.style.opacity = 
        ((elem.offsetTop+elem.offsetHeight)-
        window.pageYOffset)/window.innerHeight
    })
}

Why that's happening? Are there any collection of recommendations for mobile phone web-development?

Gergő Horváth
  • 3,195
  • 4
  • 28
  • 64
  • This particular code wouldn’t do anything anyway. It just defines a function that never gets called. And you should avoid [scroll-linked effects](https://developer.mozilla.org/en-US/docs/Mozilla/Performance/Scroll-linked_effects) in JS. Are you asking for an alternative to the `scroll` event on mobile devices? What have you tried? – Sebastian Simon Mar 03 '18 at 22:57
  • I tried to control many css values with JavaScript, to dinamically change the values depending on scroll. What i realized that the problem is with the changing values. Adding or removing classes depending on scroll positions even with transitions are working. I'm thinking about a solution which represents the same result, but that is a bit complicated. What if i insert as many classes, as many pixels changing on an effect? For an example i get the element's height, put it into a for loop, and for an example, if the element's height is 100, i create 100 classes, with opacity: 1, then 0,99... – Gergő Horváth Mar 04 '18 at 19:38

1 Answers1

0

There's no true way to get a scroll event in mobile. iOS won't hit that function until after the scrolling is done. Android it might work, but on iOS 100% will not work. More information here and here

jdmdevdotnet
  • 1
  • 2
  • 19
  • 50