向下滚动页面时出现图像 | Sharepoint 在线嵌入

Question

我已将以下代码嵌入到我的 sharepoint 在线站点中。该图像出现在右下角，单击后将我带到页面顶部，如编码；但是 Jquery javascript 代码似乎不起作用...无论滚动多少像素，图像都保持可见。

 <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"><\script>
<script>

$(window).scroll(function() {
    if ($(this).scrollTop()>100) {
        $('#toTop').fadeIn();
    } else {
        $('#toTop').fadeOut();
    }
});
</script>

<div id="toTop">
<a style="position: fixed; bottom:20px;left:5px;" href="#ctl00_onetidHeadbnnr2" title="Back to Top"><img style="border: none; height: 37.5px; width:50.5px" src="backtotop-1.png" ></a>
</div>

上面的代码包含了两个建议的解决方案，但似乎仍然不起作用！无论页面滚动多少，图像都是可见的，但一旦单击，图像就会消失。该代码在纯 .html 文件中似乎完全可以正常工作。

请帮忙！非常感谢您。

当前控制台错误：

Answer 1

是的，它是您的 jquery 源。你有没有在 jquery src 行中看到一个“空格”，你也忘了关闭标签。并且为了将来不要忘记检查浏览器控制台是否有错误。

您可以在源文件中使用以下固定代码。

<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script>
$(window).scroll(function() {
    if ($(this).scrollTop()>100) {
        $('#toTop').fadeIn();
    } else {
        $('#toTop').fadeOut();
    }
});
</script>
<style>
body{
  border: 1px dotted red;
  min-height: 1000px;
}
</style>
<div id="toTop">
<a style="position: fixed; bottom:20px;left:5px;" href="#ctl00_onetidHeadbnnr2" title="Back to Top">
  <img style="border:1px solid red; height: 37px; width:50px" src="https://i.imgur.com/WkCCy7L.jpg" >
</a>
</div>

如果现在可以解决您的错误，请告诉我。

Answer 2

检查代码的jsfiddle 链接。它工作得很好。如果 jquery 1.6.4.min.js:

你只需要检查以下行

<script type="text/javascript" src="http://code.jquery.com/jquery 1.6.4.min.js"></script>

这应该是正确的：http://code.jquery.com/jquery-3.3.1.js