Question

好的，我再也看不到了。我正在使用the scrollTo plugin并在我的网站上有一个scrollTo函数。它起作用，现在突然间它没有...

这是我的代码：

$(document).ready(function() {
    $('header').delay(300).fadeIn(750);
    $('#intro_text').delay(800).fadeIn(750);
    $("#jquery_jplayer_1").jPlayer({
        ready: function () {
            $(this).jPlayer("setMedia", {
                m4v: "mi4.m4v",
                ogv: "mi4.ogv",
                webmv: "mi4.webm",
                poster: "mi4.png"
            });
        },
        swfPath: "js",
        supplied: "webmv, ogv, m4v",
        size: {
            width: "570px",
            height: "340px",
            cssClass: "jp-video-360p"
        }
    });
});

$(function(toDemos) {
 $('h1').click(function() {
        $.scrollTo('#intro', 800);
    });
});

$(function(toDemos) {
 $('#contact').click(function() {
        $.scrollTo('footer', 800);
    });
});

$(function(toDemos) {
 $('#demos').click(function() {
        $.scrollTo('#content', 800);
    });
});

$(function(toDemos) {
 $('#toTop').click(function() {
        $.scrollTo('#intro', 800);
    });
});

$(function() {
    $("#playlist li").on("click", function() {
        $("#videoarea").attr({
            "src": $(this).attr("movieurl"),
            "poster": "",
            "autoplay": "autoplay"
        })
    })
    $("#videoarea").attr({
        "src": $("#playlist li").eq(0).attr("movieurl"),
        "poster": $("#playlist li").eq(0).attr("moviesposter")
    })
})

我只是一个初学者，但我认为我做错了。这里有什么不对吗？我看不到它。

希望你们中的一个能够！非常感谢提前。

Answer 1

如果您正在使用flesler's scrollTo plugin，则可能需要修改持续时间选项：

$.scrollTo('footer', { duration:800 });

如果您还没有下载插件来源here。我会验证它是否正确链接到您的代码。还可以尝试使用firebug之类的调试工具来帮助您进行问题排查。

注意：

要在下面的评论中指出Mark's回答任何偶然发现此问题的人，在加载任何插件之前，必须先在文件中按顺序链接jQuery。 E.g：

<script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="jquery.scrollTo.min.js"></script>

Answer 2

这是一个很老的问题，但我认为我会分享我的方式：）

$("button").on('click', function() {
	window.scrollTo({
    top: $('#intro').offset().top,
    left: 0,
    behavior: 'smooth'
  })
});

.wrapper {

  height:1000px;
  width: 300px;
  background: #eee;
}

.other {
  height: 500px;
  background: #ddd;
  padding: 20px;
  width: 100%;
}

#intro {
  height: 500px;
  background: #bbb;
  padding: 20px;
  width: 100%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Click</button>
<div class="wrapper">
  <div class="other">Other div</div>
  <div id="intro">
    Intro
  </div>
</div>

Answer 3

$("button").on('click', function() {
	window.scrollTo({
    top: $('#intro').offset().top,
    left: 0,
    behavior: 'smooth'
  })
});

.wrapper {

  height:1000px;
  width: 300px;
  background: #eee;
}

.other {
  height: 500px;
  background: #ddd;
  padding: 20px;
  width: 100%;
}

#intro {
  height: 500px;
  background: #bbb;
  padding: 20px;
  width: 100%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Click</button>
<div class="wrapper">
  <div class="other">Other div</div>
  <div id="intro">
    Intro
  </div>
</div>

scrollTo不是一个函数

3 个答案: