我怎样才能 link Revolution Slider 中的图像平滑滚动到同一页面上的 div id?
How can I link an image in Revolution Slider to a div id on the same page with smooth scroll?
我已经想出如何给 Revolution Slider 中的图像一个 id 或 class。所以我给了一张图片 class,然后将它链接到同一页面上的一个部分。不过,实在是太生涩了,直接跳到小节了
我添加了一些 jQuery 来平滑过渡,但它不起作用。我收到错误:
"Uncaught SyntaxError: Unexpected identifier"
好像是指我在Revolution Slider里给的图class,但是不明白为什么会出错。我只是想让用户顺利地被引导到页面的下一部分。这是我的 jQuery:
(function($)
$(".click-to-scroll").click(function() {
$('html, body').animate({
scrollTop: $("#top-home").offset().top
}, 1000);
});
(jQuery);
我使用的是 Divi 主题,它允许您在仪表板的主题选项中将 JavaScript 放入网站的 header 部分。网站在这里:customdesign.mgsites.net
如有任何帮助,我们将不胜感激。谢谢。
正确的语法是这样的:
(function($) {
$(".click-to-scroll").click(function() {
$('html, body').animate({
scrollTop: $("#top-home").offset().top
}, 1000);
});
}) (jQuery);
您需要将函数括在大括号中。以及关闭左括号。
所以经过大量调整后,我发现我遇到问题的原因是旋转滑块在 DOM 之外加载,在其他一切之后。所以我添加了一个文档就绪函数,以确保 jQuery 被调用(看起来它被忽略了)。现在可以使用了,所以如果有人再次遇到这个问题,这就是您需要的代码。
<script>
jQuery( document ).ready(function() {
jQuery(".click-to-scroll").on("click", "*", function() {
jQuery("html, body").animate({ scrollTop: jQuery('#top-home').offset().top }, "slow");
return false;
});
});
</script>
我只把它放在主页的 header 中。我使用了一个名为 Header/Footer 脚本的插件,它允许您将代码直接放入单个 post/page 或每个 post/page 的 header 中。另外,请注意它被包裹在标签中,因为任何类型的代码都可以放在这里,所以我必须指定它是一个脚本而不是元数据、评论等。
我已经想出如何给 Revolution Slider 中的图像一个 id 或 class。所以我给了一张图片 class,然后将它链接到同一页面上的一个部分。不过,实在是太生涩了,直接跳到小节了
我添加了一些 jQuery 来平滑过渡,但它不起作用。我收到错误: "Uncaught SyntaxError: Unexpected identifier"
好像是指我在Revolution Slider里给的图class,但是不明白为什么会出错。我只是想让用户顺利地被引导到页面的下一部分。这是我的 jQuery:
(function($)
$(".click-to-scroll").click(function() {
$('html, body').animate({
scrollTop: $("#top-home").offset().top
}, 1000);
});
(jQuery);
我使用的是 Divi 主题,它允许您在仪表板的主题选项中将 JavaScript 放入网站的 header 部分。网站在这里:customdesign.mgsites.net
如有任何帮助,我们将不胜感激。谢谢。
正确的语法是这样的:
(function($) {
$(".click-to-scroll").click(function() {
$('html, body').animate({
scrollTop: $("#top-home").offset().top
}, 1000);
});
}) (jQuery);
您需要将函数括在大括号中。以及关闭左括号。
所以经过大量调整后,我发现我遇到问题的原因是旋转滑块在 DOM 之外加载,在其他一切之后。所以我添加了一个文档就绪函数,以确保 jQuery 被调用(看起来它被忽略了)。现在可以使用了,所以如果有人再次遇到这个问题,这就是您需要的代码。
<script>
jQuery( document ).ready(function() {
jQuery(".click-to-scroll").on("click", "*", function() {
jQuery("html, body").animate({ scrollTop: jQuery('#top-home').offset().top }, "slow");
return false;
});
});
</script>
我只把它放在主页的 header 中。我使用了一个名为 Header/Footer 脚本的插件,它允许您将代码直接放入单个 post/page 或每个 post/page 的 header 中。另外,请注意它被包裹在标签中,因为任何类型的代码都可以放在这里,所以我必须指定它是一个脚本而不是元数据、评论等。