我在我们的单页网站上使用JQuery scrollTo插件在不同部分之间垂直滚动.
滚动在所有浏览器中运行良好,除了 iOS Safari,滚动但非常生涩.我在页面上使用了许多其他Jquery插件,因此可能与其中一个插件冲突.
如果有人知道scrollTo的替代方案可以在iPad上顺利运行,或者可以建议从哪里开始解决问题,我会很感激帮助.我试过这个解决方案,但没有成功.
我有一个网页,它是一个页面,用户使用使用scrollto jquery插件的链接导航到每个部分.
我的问题是:我想在主菜单中显示活动链接.因此,如果您滚动到联系表单,则会突出显示联系人链接.现在,我可以通过在单击后添加类来在jquery中执行此操作.如果这样做,如果用户要手动滚动到另一个部分,联系人链接仍然是活动的,这将是不正确和误导.
所以我的想法是以某种方式解决当前正在查看哪个div id.我真的不明白怎么做.有任何想法吗？
我从这个链接获得了一个jquery代码(页面末尾): 如何使用JavaScript/jQuery滚动到页面顶部？
你为什么不在你的html文件的最开头使用一些引用元素,比如
<div id="top"></div>
然后,当页面加载时,只需执行
$(document).ready(function(){
top.location.href = '#top';
});
如果浏览器在此功能触发后滚动,您只需执行此操作即可
$(window).load(function(){
top.location.href = '#top';
});
现在,一切正常,但不是谷歌铬! 我如何为谷歌浏览器修复此代码？ 以及如何为此代码添加一些动画？像滚动速度或快速,慢等...
我正在iOS中构建一个聊天应用程序但是我在UITableView上显示所有消息时遇到了一些问题.我希望表视图在加载时滚动到底部,以便用户在打开应用程序时可以看到最新消息.
为此,我在刷新数据的函数中添加了此代码:
NSIndexPath* ipath = [NSIndexPath indexPathForRow: [self.messageOnTimeline numberOfRowsInSection:0]-1 inSection: 0];
[self.messageOnTimeline scrollToRowAtIndexPath: ipath atScrollPosition: UITableViewScrollPositionTop animated: YES];
这工作正常,直到我在tableview中添加了一个标题.我添加了以下代码,现在加载应用程序时它不会滚动到底部:
-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, tableView.frame.size.width, 30)];
return view;
}
有谁知道为什么？
非常感谢您的帮助
无法将缓动方法应用于Jquery ScrollTo:
$("#scroller").scrollTo(target,1000,{axis:'x',easing:'linear'});
这不会让任何事情变得轻松......我现在开始使用jquery(长时间使用原型)所以这肯定是我的错误.我需要一个缓动插件来实现这一目标吗？这个插件的缓动选项有什么用(如果有的话)？文档不清楚这一点.谢谢.
我尝试创建一个网页,顶部有一个固定的导航栏,覆盖下面的内容.当在网址中加载带锚点的页面时,正常的行为是页面将锚点滚动到窗口的顶部.但是那个内容隐藏在导航栏下面.所以我尝试使用JavaScript scrollTo()来解决这个问题.我的解决方案适用于Firefox和Opera,但不适用于Chrome.请试试这个例子.有关如何在Chrome中解决此问题的任何想法？谢谢.
TEST.HTM:
<!DOCTYPE HTML>
<html>
<head>
<title>Test</title>
<meta charset='UTF-8'>
<style type='text/css'>
#navi { position:fixed; left:0; top:0; width:100%; height:100px; background-color:yellow; }
#spacer { background-color:cyan; height:100px; }
#spacer2 { height:1000px; }
.style1 { background-color:green; height:200px; }
</style>
<script type='text/javascript'>
/* <![CDATA[ */
function scrollAnchor() { // doesn't work in Chrome
var y = document.getElementById(window.location.hash.substr(1)).offsetTop - 110;
window.scrollTo(0, y);
//alert(y);
}
/* ]]> */
</script>
</head>
<body id='top' onload='scrollAnchor();'>
<div id='navi'>
<a href='./test2.htm'>Menu</a>
</div>
<div id='main'>
<div id='spacer'></div>
<h3 id='1'>Heading 1</h3><p class='style1'></p> …让我的jquery手风琴做我想做的事情有点问题.
我总是希望点击的标签从页面顶部滚动到固定数量的像素,我有点工作.但是,只要活动选项卡位于单击的选项卡上方,并且页面已经向下滚动一点,所单击选项卡的顶部和部分内容就会向上滚动超过页面顶部.
这就是我得到的:
$(function() {
$("#accordion").accordion({
autoHeight: false,
collapsible: true,
heightStyle: "content",
active: 0,
animate: 300
});
$('#accordion h3').bind('click',function(){
theOffset = $(this).offset();
$('body,html').animate({
scrollTop: theOffset.top - 100
});
});
});
这是一个解释我的问题的小提琴,
例如,展开"第2部分",向下滚动并单击"第3部分"选项卡,它将全部滚动到页面外,其他方式可以正常工作.
如果在打开一个新选项之前关闭活动选项卡它也可以正常工作,所以我假设这与崩溃选项卡的高度有关,这会使滚动到顶部功能!？
希望有人可以提供帮助,我可能会采取错误的方法.我真的不知道我在做什么,因为我的jquery技能仅限于基本的切割粘贴理解!^^
在此先感谢,所有的帮助和指针区域更受欢迎!:)
干杯
我正在使用http://nick-jonas.github.io/windows/的修订版本,它允许用户在DIV中滚动不同的部分,然后将其重新捕捉到位.
因为我正在滚动DIV我已经替换了:
$('.windows').animate({scrollTop: scrollTo }, options.snapSpeed, function(){
if(!completeCalled){
if(t){clearTimeout(t);}
t = null;
completeCalled = true;
options.onSnapComplete($visibleWindow);
}
});
有:
$('.windows').scrollTo( $visibleWindow , options.snapSpeed, { onAfter:function(){
if(!completeCalled){
if(t){clearTimeout(t);}
t = null;
completeCalled = true;
options.onSnapComplete($visibleWindow);
}
}});
因此,您可以看到我使用scrollTo插件跳转到可见的div而不是像前面的代码那样依赖复杂的偏移量.
我在原始代码和我自己的代码中注意到的一个错误是,如果捕捉已经开始,然后用户通过滚动来中断此操作,他们将最终与滚动事件进行战斗以滚动内容.因此,如果scrollTo向下滚动100个像素,然后他们尝试使用浏览器滚动条向上滚动300个像素,则屏幕将在事件和浏览器滚动战斗时出现问题.
关于如何阻止这一点的任何想法？我希望现在我正在使用scrollTo插件,它将变得更容易处理.
到目前为止,我尝试过:
$('.windows').bind("scroll mousedown DOMMouseScroll mousewheel keyup", function(e){
if ( e.which > 0 || e.type === "mousedown" || e.type === "mousewheel"){
$(this).stop().unbind('scroll mousedown DOMMouseScroll mousewheel keyup');
}
});
但是这样可以阻止所有的攻击......任何修复的想法？
我遇到了这个网站http://www.mediafire.com/的主页,当你滚动鼠标滚轮时,页面自动定位到页面的下一部分.我想知道它是如何完成的.谁能帮我这个.提前致谢.
此致,Aswin
我在mysite.com上有一个页面,它使用iframe从subdomain.mysite.com中提取内容.我正在使用iframe-resizer脚本(https://github.com/davidjbradshaw/iframe-resizer)来确保iframe的高度始终与其内容的高度相匹配.像魅力跨浏览器/操作系统一样工作.
在iframe中是一个带有客户端验证的长格式.如果用户尝试提交表单并且它没有完全验证,我使用scrollTo(在iframe内的表单页面上)将页面滚动到表单的顶部,在表单中显示详细的错误消息.这一切都适用于桌面浏览器(Mac和Windows)以及所有Android设备 - w/r/t scrollTo滚动到iframe中表单的顶部.
但是,在iOS上,它不起作用 - 滚动到iframe内部的窗体顶部不会发生.我已经读过,自2011年以来,你需要在iOS上打开iframe滚动的能力 - 我不确定这样做是否能解决我的问题.我读到了添加style ="overflow:auto; -webkit-overflow-scrolling:touch;" 到围绕iframe的div,并尝试了这个,但它没有任何影响.
我还不知道我是否找不到合适的解决方案让它在iOS中运行,或者如果在iOS上没有办法让scrollTo在iframe内部工作.思考？
scrollto ×10
jquery ×8
ios ×3
javascript ×2
scroll ×2
accordion ×1
flicker ×1
header ×1
iframe ×1
jquery-ui ×1
mousewheel ×1
scrolltop ×1
uitableview ×1