I have back-to-top script with an arrow icon which appears when scrolling down and disappears when the page content is on top. Works perfect, but when I insert the script in WordPress the scrollTop part of the script works but not the fade-in and fade-out effect.
Any solution?
jQuery('body').prepend('<a href="#" class="back-to-top">Back to Top</a>'); var amountScrolled = 300; $ (window).scroll(function() { if ( $ (window).scrollTop() > amountScrolled ) { $ ('a.back-to-top').fadeIn('slow'); } else { $ ('a.back-to-top').fadeOut('slow'); } }); $ ('a.back-to-top, a.simple-back-to-top').click(function() { $ ('html, body').animate({ scrollTop: 0 }, 700); return false; }); body {background:#FEF1D4; height:1000px} .back-to-top { display: none; width: 4.75rem; height: 4.75rem; text-indent: -9999px; position: fixed; z-index: 1500; left: 0.5rem; bottom: 1rem; background: url(https://static.thenounproject.com/png/1920879-200.png) no-repeat center 43%; background-size: contain; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> Expected result → jsfiddle
WordPress result ↓
