0

Jqueryを使用して自分のサイトからHTMLオブジェクトを選択しています。

<div id="banner">
  <!-- stuff in here -->
</div>

このコードを使用しています：

$(window).load($(function()
{
    var elem = $("#banner");
    var top = elem.offset().top;
    var maxTop = $("#footer").offset().top - elem.height();
    var scrollHandler = function()
    {
      var scrollTop = $(window).scrollTop();
      if (scrollTop<top) {
        elem.css({position:"relative",top:""})
      } else if (scrollTop>maxTop) {
        elem.css({position:"absolute",top:(maxTop+"px")})
      } else {
        elem.css({position:"fixed",top:"0px"})
      }
    }
    $(window).scroll(scrollHandler);scrollHandler()

}));

ただし、「Uncaught TypeError：Undefinedのプロパティ'top'を読み取れません」というエラーが発生し続けます

何らかの理由で、divの「バナー」が表示されません。

なぜですか？

編集：

以下の提案に従って、コードを$（window）.loadから$（document）.readyに変更しました。まだ同じ問題。

$(document).ready($(function()
{
    var elem = $("#banner");
    var top = elem.offset().top;
    var maxTop = $("#footer").offset().top - elem.height();
    var scrollHandler = function()
    {
      var scrollTop = $(window).scrollTop();
      if (scrollTop<top) {
        elem.css({position:"relative",top:""})
      } else if (scrollTop>maxTop) {
        elem.css({position:"absolute",top:(maxTop+"px")})
      } else {
        elem.css({position:"fixed",top:"0px"})
      }
    }
    $(window).scroll(scrollHandler);scrollHandler()

}));
4

2 に答える 2

3

関数ではなく、load関数にjQueryオブジェクトを渡します。メインコールバックの周りの$（）を削除してみてください。例えば

$(window).load(function()
{
var elem = $("#banner");
var top = elem.offset().top;
var maxTop = $("#footer").offset().top - elem.height();
var scrollHandler = function()
{
  var scrollTop = $(window).scrollTop();
  if (scrollTop<top) {
    elem.css({position:"relative",top:""})
  } else if (scrollTop>maxTop) {
    elem.css({position:"absolute",top:(maxTop+"px")})
  } else {
    elem.css({position:"fixed",top:"0px"})
  }
}
$(window).scroll(scrollHandler);scrollHandler()

});

注：ここの一部の人々が示唆しているように、$（document）.ready（）の代わりに$（window）.load（）を使用しても、それ自体は問題ありません。2つ目は、より早く実行されるため、より慣用的です（ユーザーがページをより速く操作できるようにします）。詳細については、次のリンクを参照してください：http: //4loc.wordpress.com/2009/04/28/documentready-vs-windowload/

于 2012-11-05T18:59:14.063 に答える
1 
$(window).load($(function()   // Passing a jQuery Object Here

察するに

$(window).load( function()   //

これでうまくいかない場合は、

$(document).ready( function()
于 2012-11-05T18:58:23.810 に答える