我正在尝试快速导航以使其正常工作。它漂浮在侧面。当他们单击链接时,会将他们带到页面上的该ID。我正在遵循Treehouse的本指南。这就是我要滚动的内容:
$("#quickNav a").click(function(){
var quickNavId = $(this).attr("href");
$("html, body").animate({scrollTop: $(location).offset().top}, "slow");
return false;
});
我最初将其放置在之前</body>
。但是我似乎遇到了一种竞争情况,在quickNav编译之前就已经触发了这种情况(它ng- hide
放在上面,不确定是不是引起了它-但它在DOM内)。
如果我在控制台中运行该代码块,则滚动将按预期进行。
我认为将其移入控制器会更有效-或更可能在指令中。但是我没有那么幸运。 如何获得此代码块以与AngularJS一起使用?
这是一个简单的指令,单击后将滚动到一个元素:
myApp.directive('scrollOnClick', function() {
return {
restrict: 'A',
link: function(scope, $elm) {
$elm.on('click', function() {
$("body").animate({scrollTop: $elm.offset().top}, "slow");
});
}
}
});
演示:http :
//plnkr.co/edit/yz1EHB8ad3C59N6PzdCD?p=preview
要获取有关创建指令的帮助,请查看视频,网址为http://egghead.io,从#10“第一个指令”开始。
编辑 :要使其滚动到href指定的特定元素,只需选中attrs.href
。
myApp.directive('scrollOnClick', function() {
return {
restrict: 'A',
link: function(scope, $elm, attrs) {
var idToScroll = attrs.href;
$elm.on('click', function() {
var $target;
if (idToScroll) {
$target = $(idToScroll);
} else {
$target = $elm;
}
$("body").animate({scrollTop: $target.offset().top}, "slow");
});
}
}
});
然后,您可以像这样使用它:<div scroll-on-click></div>
滚动到单击的元素。或<a scroll-on-click href="#element-id"></div>
滚动到带有ID的元素。
滚动窗口屏幕到指定位置,该方法是对window.scrollTo()方法在手机端的增强实现,可设定滚动动画时间及滚动结束后的回调函数;鉴于手机屏幕大小,该方法仅可实现屏幕纵向滚动。 .scrollTo( ypos [, duration] [, handler] ) ypos Type: Integer 要在窗口文档显示区左上角显示的文档的 y 坐标 duration Type: Integer
通过这款jQuery插件可以简单的控制页面的滚动,例如滚动到某个元素或者是滚动多大的高度等等。 示例代码: $('div.pane').scrollTo(...);//all divs w/class pane $.scrollTo(...);//the plugin will take care of this
问题内容: 每当用户接近文档顶部时,我都会尝试向下滚动100px。 当用户接近文档顶部时,我执行了该函数,但是.scrollTo函数不起作用。 我在之前和之后放置了一个警报,以检查它实际上是否是阻止该行的线路,并且只有第一个警报响起,这是代码: 我知道我的jquery页面链接正确,因为我在整个过程中都使用了许多其他jquery函数,而且它们都可以正常工作。我也尝试过从上方删除“ px”,但似乎没有
问题内容: 有没有办法在AngularJS绑定中使用数学函数? 例如 这个小提琴显示了问题 http://jsfiddle.net/ricick/jtA99/1/ 问题答案: 如果您对数学一无所知,则必须注入示波器 。 最简单的方法,你可以做 在您的控制器中。我猜想正确地做到这一点的角度方法是创建一个数学服务。
我有WebView,它正在使用JS加载超文本标记语言。从WebView我调用JS函数,它正在寻找超文本标记语言中的一些文本。在此函数中,我有将WebView滚动到下一个匹配文本的命令: 如果我将WebView放在ScrollView中(如下面的代码所示),WebView将不会滚动(即使命令< code>webView.scrollTo(x,y)也不会滚动)。但是如果我把它放在ScrollView之
问题内容: 指令功能的执行顺序是什么?该文档似乎没有解决此问题。 防爆 template / templateUrl(已评估) 控制器 编译 链接 从下面的答案中:http ://plnkr.co/edit/79iyKSbfxgkzk2Pivuak(插件显示嵌套和兄弟指令) 模板被解析 (在编译中对模板所做的更改会扩展到链接功能) 问题答案: 预链接功能:在链接子元素之前执行。执行DOM转换并不安