javascript - Sharepoint 窗口滚动不触发

标签 javascript jquery html sharepoint scroll

我的 SharePoint 页面生成了这个 HTML(剪辑):

<body scroll="yes" onload="if (typeof(_spBodyOnLoadWrapper) != 'undefined') _spBodyOnLoadWrapper();" class="v4master" style="overflow: scroll" spellcheck="false">
    <form name="aspnetForm" method="post" action="/Lists/List/EditNewForm.aspx?ID=2&amp;Source=https%3A%2F%2Fsp2010-test%2Eatwss%2Ecom%2FLists%2FList%2FAllItems%2Easpx" onsubmit="javascript:return WebForm_OnSubmit();" id="aspnetForm" style="overflow: scroll">

// some html here

<div id="competenceTotalSum" style="position: absolute; left: 500px; top: 400px; width: 100px; height: 50px; background-color:gray" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
    $(function(){       
        $("form#aspnetForm").bind("scroll", function(e){
            alert("scroll");
            $("#competenceTotalSum").css("top", $(this).scrollTop() + 400);
        });
    });
</script>

// some html here

    </form>
</body>

事件 scroll 未触发。我更改了 bodyscroll 属性,bodyform 的 overflow 属性,尝试绑定(bind) scroll 事件到不同的对象(windowbodyform)。当将 scroll 事件更改为 click 事件时 - 它会触发。除了滚动元素的 overflow 属性外,我没有找到任何原因。

最佳答案

这是一个老问题,但这仍然可能对其他人有帮助,我想在我的一个共享点项目中实现滚动到顶部功能。

大约几个小时后我的脑袋坏了。我用下面的代码让它工作。

实际上 $(window).scroll() 不会在共享点触发,我在那里使用 master id,它是 ('#s4-workspace') 来获取它工作。

$(document).ready(function () {
    var offset = 220;
    var duration = 1000;

  jQuery('#s4-workspace').scroll(function() {

        if (jQuery(this).scrollTop() > offset) {
            jQuery('.arrowToTop').fadeIn(duration);
        } else {
            jQuery('.arrowToTop').fadeOut(duration);
        }
    });

    jQuery('.arrowToTop a').click(function(event) {
        event.preventDefault();
       jQuery('#s4-workspace').animate({scrollTop: 0}, duration);
        return false;
    }) });

我使用了下面的CSS样式

.arrowToTop {
   display: none;
   height: 100%;
   position: fixed;
   right: 20px;    
   z-index: 9999;
   bottom: 0;
   width: 70px;
   height:70px;
} 

.arrowToTop a{     
    width: 70px;
    height:70px; 
    display: block;
     background: url(../images/arrow.png) no-repeat left 0;
    }

关于javascript - Sharepoint 窗口滚动不触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18722085/

相关文章:

javascript - 随机CSS位置jquery

鼠标悬停时的 jQuery 图像 PULSE 动画,淡入另一个图像

javascript - 如何将具有多个参数的 URL 传递到 URL?

javascript - 为什么数据表的表头与内容不对齐?

javascript - 如何帮助 Google 的 Closure 编译器优化我的 JavaScript 代码?

javascript - 重定向 mobirise 电子邮件表单

javascript - 动态验证所有 radio 输入是否已检查

javascript - 在 Ruby on Rails 中包含 Trianglify

jquery - AJax 不适用于 bootstrap-select

html - 添加文本时停止 div 向下移动