jQuery淡入和淡出滚动在iOS上无法正常工作

Question

I have the following code that fades a button in fixed to the bottom as the user scrolls and fades out when the user scrolls to the top on mobile... works fine when tested in responsive mode on desktop, however on iOS it snaps on after a moments delay but fades out when scrolling back to the top as it should, how can I stop it from snapping on?

CSS

.cta {
    background-color: rgba(75, 113, 252, 0.9);
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    text-align: center;
    line-height: 50px;
    color: #fff;
    height: 50px;
    width: 100%;
    opacity: 1;
    z-index: 999;
 }

js

$(window).scroll(function() {
if ($(this).scrollTop()> 150) {
$('.cta').fadeIn();
} else {
$('.cta').fadeOut();
}
});

Answer 1

Have you tried different methods of lazy loading? I've had success with this plug-in in the past: https://github.com/tuupola/jquery_lazyload

It's not particularly complicated. Here's a quick example:

HTML:

<img class="example" data-original="img/myImage.jpg">

JS:

$("img.example").lazyload();