Tag: 滚动

使用jquery平滑滚动

我知道有关SF的平滑滚动的问题，但我无法找到我想要的东西。 已经使用了改进的平滑滚动脚本，但它是我想要实现的网站http://michaelacevedo.com上的那个。 当你点击链接然后它开始真正慢，然后快速动画带你到所需的部分。 它与其他平滑卷轴完全不同。 任何人都可以帮助实现这种效果并解释代码在做什么。 谢谢

停止页面从焦点滚动

我刚刚安装了一个脚本，专注于我的第一个输入字段，即向页脚。 焦点效果很好，但页面在加载后滚动到底部。 我仍然可以使用焦点并停止页面向下滚动到第一个输入字段吗？ http://www.ubspack.com/

jQuery – parallax – 正确更新背景位置

目标 这是对此问题的后续问题。 我正在尝试创建一个视差滚动效果。 视差容器的实现方式如下： 当容器滚动到视图中并在离开视图时停止时，视差效果成功启动。 问题 不幸的是，当我将视差容器放在页面上时，效果开始于错误位置的背景位置 。 我理解为什么会出现这个问题，但我不确定如何解决它。 我需要的基本上是这样的： 一旦视差容器滚动到视图中就开始效果： 工作 。 离开视图后停止效果： 工作 。 仅将背景位置移动到已进入视图的滚动距离 。 不是相对于页面顶部滚动的距离。 在这里摆弄 对于页面下方的视差容器： 您可以看到图像的边缘。 我正在努力寻找解决方案。 思考 到目前为止，我的尝试基于这样的想法，即将视差容器的距离仅限于页面顶部一次（不要用每个滚动更新它）并在计算中实现它。 但我似乎无法让它正常工作。 我错过了什么吗？ 进一步澄清： 任何页面上都可以有多个视差容器。 每个人都可以拥有自己的背景图像集。 （在CSS中） 我不知道页面上会有多少视差容器。 我不知道他们在哪里。 只有那些可见的移动。 码 只有相关部分： $(window).scroll(function(){ // Bind window scroll event $( “.parallax” ).each(function() { if( $( this ).is_on_screen() ) { // Check if […]

使用jquery为backgroundImage隐藏或显示none

$(‘.arrow’).backgroundImage=”url(‘../img/arrow.png’).style.display = ‘none'”; 我正在使用animate.css插件向下滚动隐藏向下箭头。 `$( document ).ready(function() { console.log( “ready!” ); $(“h1″).animate({color:”#ffffff”}, 600); $(‘.arrow’).backgroundImage=”url(‘../img/arrow.png’)”;` if (direction == “up”) { $(“h1″).animate({color:”#ffffff”}, 600); $(‘.arrow’).backgroundImage=”url(‘../img/arrow.png’)”; } else if (direction == “down”) { $(“h1″).animate({color:”#444444″}, 600); $(‘.arrow’).backgroundImage=”url(‘../img/arrow.png’).style.display = ‘none'”; 箭头不起作用。 我的function写得不正确吗？ 如何隐藏backgroundImage？ 有没有更好/更有效的方法来解决这个问题？

$（窗口）.scroll函数不会触发

我正在尝试将此教程技术应用到我当前的项目中： http ： //www.webgeekly.com/tutorials/jquery/a-simple-guide-to-making-a-div-static-as-you-scroll-past -它/ （特别是左侧的相对/修复社交媒体工具栏） 并没有开始被“固定”直到某个滚动值。 停止在页脚之前“固定”（不重叠） 我一直在跟着，但是$（window）.scroll（）函数永远不会为我开火..（仅在小提琴示例/测试中）.. $（document）.ready中的其他console.log（） ）fire ..但是在$（window）.scroll（）函数里面注意到了吗？ //sticky map placement $(function(){ var msie6 = $.browser == ‘msie’ && $.browser.version = top) { $(‘#mapContainer’).addClass(‘fixed’); console.log(“class added”); }else { $(‘#mapContainer’).removeClass(‘fixed’); console.log(“class removed”); } }); } }); 相关风格:(为了让事情有效而多次改变） （mapContainer父级） #col-2 { float:right; width:935px!important; padding:0; margin:0; position: relative; height:auto; } #mapContainer{ display:table; width:240px; /* […]

jQuery iFrame内容平移（而不是滚动）

我正在寻找像谷歌地图而不是常规滚动的iFrame 内容平移 ..我的意思是说..我已经在iFrame中加载了google.com。 但是我没有滚动那个iFrame而是想使用Panning来滚动页面内容Up / Down。 这样的iFrame内容平移是否有任何插件？

如何在达到并加载无限滚动后重新加载jquery函数

即时通讯使用jquery插件进行无限滚动，除了需要运行的客户端脚本外，它的工作正常。 我的无限滚动脚本是： $(‘.infinite-container’).waypoint(‘infinite’, { container: ‘auto’, items: ‘.infinite-item’, more: ‘.infinite-more-link’, offset: ‘bottom-in-view’, loadingClass: ‘infinite-loading’, onBeforePageLoad: $.noop, onAfterPageLoad: $.noop }); 我认为我需要做的是以某种方式调用我的服务器端脚本使用这个： onAfterPageLoad: 我的关键问题是我的twitter和facebook按钮加载了。 所有我能看到的是“twitter”这个词，facebook按钮根本就没有显示出来。 但在初始页面上他们没有加载任何问题。 我不知何故需要再次加载： (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = “//connect.facebook.net/en_GB/all.js#xfbml=1&appId=***********”; fjs.parentNode.insertBefore(js, fjs); }(document, ‘script’, ‘facebook-jssdk’)); 以及这些： $(document).ready(function() { $(‘.container’).stickem(); […]

平滑滚动到内部链接的最佳方法

我已经搜索过并看到很多关于这个主题的例子，但我无法找到最好的方法。 我只是对JS和jQuery有点熟悉，我想问一下平滑滚动。 Plastik Panjur Alüminyum (İthal / Yalıtımlı) Panjur Otomatik Panjur 我有这样的导航。 这会不稳定地滚动。 但我想慢慢来。 这是最短最简单的方法吗？ 我对JS更熟悉，我不想下载和使用JS插件。 我需要通过单击方法知道我的链接的完整语法（它们都有相同的类） 我应该从链接中删除href park吗？ 等待你的帮助仍然在寻找 编辑!!!：在这种情况下，我只需要一个class级。 是否可以为多个类提供此属性？ function scrollToElement (selector) { $(‘html, body’).animate({ scrollTop: $(selector).offset().top }, 2000); }; $(document).on(‘click’, ‘a.uruna’, function () { scrollToElement($(this).attr(‘href’)); }); 我有（’click’，’a.uruna’，function（），我怎么能在这里插入另一个类，或者我应该写： $(document).on(‘click’, ‘a.uruna’, function () { scrollToElement($(this).attr(‘href’)); }); $(document).on(‘click’, ‘a.new’, function () { scrollToElement($(this).attr(‘href’)); });

如何让scrollToFix插件限制停在我网站的页脚？

我在我的网站上使用scrollToFix脚本来修复广告，因为用户向下滚动页面以及当用户到达页脚时释放（以便广告不与页脚重叠）。 但是，下面的代码会导致广告停止在页面的三分之一和一半之间滚动，而不是在页脚处。 将其设置为滚动到容器的outerHeight减去页脚的高度，使其停止在该位置。 $(document).ready(function() { $(‘.right’).scrollToFixed({ marginTop: $(‘.float’).outerHeight() + 8, limit: $(‘footer’).offset().top }); }); 有没有关于如何更准确地停止它的想法？

替代（窗口）.scroll

可能重复： ScrollTop在Chrome中真的很生涩 我正在使用以下代码获取一个返回顶部按钮，并在用户滚动后导航淡入。 问题是每次滚动时它都会触发，因此导致滚动变得非常生涩。 是否有另一种方法可以执行此操作，这可能只触发一次该function？ $(function () { $(window).scroll(function () { if ($(this).scrollTop() > 600) { $(‘#backToTop, #navigation’).fadeIn(); } else { $(‘#backToTop, #navigation’).fadeOut(); } }); }); });