Question

当我向下滚动时，我有一个简单的div标题（如下面的代码所示）我不希望窗口本身滚动，但会降低div高度。

<html>
    <head>
        <title>Test</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
        <script src="javascripts/headani.js"></script>
    </head>
    <body>
        <div id="pageTop"></div>
        <div id="pageArticle">
            <div class="siteDesc">
                <p id="hello"></p>
            </div>
        </div>
    </body>
</html>

CSS是：

body {
    margin: 0 0 0 0;
    background-color: beige;
}
#pageTop {
    width: 100%;
    height: 450px;
    background-color: tan;
}
#pageArticle {
    width: 100%;
    height: 1000px;
    background-color: rgba(0,0,0,0);
}
#siteDesc {
    height: 500px;
    background-color: black;
    width: 1000px;
    margin: auto;
}

最后我的jQuery是:(请记住，这只是一个粗略的模型，一些测试变量可能仍然存在，所以如果不使用变量或不使用函数如何预期那么我可以为没有道歉做一些家务）

$(document).ready( function() {
    var headHeight = $('#pageTop').height();
    $(window).scroll(function() {
        if (headHeight > 50) {
            $(document).bind("scroll", function(e) {
                e.preventDefault;
            })
            headHeight = (headHeight - 1);
            $('#pageTop').css('height', headHeight);
        }
        $('#hello').html($(document).scrollTop() + "<br/>" + headHeight);
    })
});

我得到它的工作，以最小化上下滚动的div（我将完成向下滚动较小，向上滚动时更大）但我遇到的问题是我不想要滚动体直到pageTop的高度为50！我只是想知道实现这个目标的最佳方法是什么？如你所见，我试图绑定滚动但失败了！

Answer 1

看起来滚动事件在滚动后直接触发，因此您无法阻止事件默认操作，因为操作已经发生（滚动）。所以你可以做的就是听取values: @Model.ClosesJson //didn't work values: <text> @Model.ClosesJson </text> //didn't work values: $("#ClosesJson").val() //Model entity as hidden - didn't work事件和public ActionResult Dashboard() { ProjectEntities projectDb = new ProjectEntities(); var model = new DashboardViewModel(); model.Closes = new List<ClosesModel>(); var prices = projectDb.uspGetCloses().ToList(); foreach (var result in prices) { var close = new ClosesModel { Close = result.Close, CloseCreatedDate = result.CloseCreatedDate }; model.Closes.Add(close); } model.ClosesJson = "[[" + System.Convert.ToString(model.Closes[0]. CloseCreatedDate.Subtract(new DateTime(1970,1,1)).TotalMilliseconds) + ", " + System.Convert.ToString(model.Closes[0]. Close) + "]"; for (int i = 1; i < model.Closes.Count; i ++) { model.ClosesJson = model.ClosesJson + ", [" + System.Convert.ToString(model.Closes[i].CloseCreatedDate.Subtract(new DateTime(1970,1,1)).TotalMilliseconds) + ", " + System.Convert.ToString(model.Closes[i].Close) + "]"; } model.ClosesJson = model.ClosesJson + "]"; return View(model); }事件来停止行动。

＆＃13;

wheel

＆＃13;

keydown

＆＃13;

$.fn.scrollEvent = function(handler) {
  this.on('wheel', function(e) {
    handler(e);
  });
  this.on('keydown', function(e) {
    if (e.which === 40) {
      handler(e);
    }
  });
};

$(document).ready(function() {
  var headHeight = $('#pageTop').height();
  window.scrollEvent
  $(window).scrollEvent(function(e) {
    if (headHeight > 50) {
      e.preventDefault();
      e.stopPropagation();
      headHeight = (headHeight - 30);
      $('#pageTop').css('height', headHeight);
    }
    $('#hello').html($(document).scrollTop() + "<br/>" + headHeight);
    return false;
  });
});

＆＃13;

jQuery滚动Div Heights

1 个答案: