我有一个div class ='messages'.我通过jQuery.append()向这个div添加日期以下是样式:
.messages {
border: 1px solid #dddddd;
padding:10px;
height: 400px;
overflow-x:visible;
overflow-y: scroll;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin-bottom:10px;
font-size:14px;
}
对于autoscroll我使用这样的功能:
receiveMessage = function (name, message, type) {
//adding new message
$("#messages").append('<strong>' + name + ": " + '</strong>' + message + '<br>');
/autoscrolling to the bottom
$("#messages").animate({
scrollTop: $("#messages").height()
}, 300);
}
大约有20条消息正常滚动,但在"挂起"后,新消息不会滚动.Chrome版本19.0.1084.56.我做错了什么？谢谢!
我在窗口内有一个滚动元素.
假设一个分区有一个带有溢出auto的类"currentContainer",并且该分区包含大量的文本,因此它肯定足够大,可以滚动.
现在我必须根据"currentContainer"向下滚动多少来计算一些特定元素与其父滚动div(即"currentCoantainer")的偏移量.
但是在计算偏移量时,我总是得到内部子元素相对于窗口而不是"currentContainer"的偏移量.
@Shikkediel我也尝试使用position().top而不是,offset().top但也给出了相同的结果.看看它 :
请不要建议使用:
$("<reference of scrolling element").scrollTop()
+
$("<reference of child element whose offset I want to calculate>").offset().top
因为这会使我的实际计算变得复杂,我将要做的除此之外.
我不想使用上述方法的原因是我试图修改现有代码已经太乱了但是在窗口方面工作得很好我只需要更新它以便它开始相对于它工作父母滚动div.
我尝试使用上面提到的方法,但它为我打开了一盒螃蟹.因为功能太紧密耦合了.所以我想如果我能得到简单直接的解决方案,即用.offset().top 其他东西替换.
我尝试调试代码但仍然没有运气我在http://jsfiddle.net/arpitajain/kwkm7com/添加了实际代码
PS它是实际代码但不完整我认为此错误不需要其余代码.
我有几个锚点链接到页面中的特定部分(使用主题标签),以及滚动到文档窗口顶部或底部的锚点.
$("html, body").animate({ scrollTop: $(document).height() }, 2000);
但是,只要动画和滚动到达目的地并完成,文档滚动和滚动条似乎会禁用几秒钟.例如,如果单击"转到页面底部"链接,我的文档窗口将正确滚动到页面底部.当我尝试向上滚动时,它会在一个抖动的动作中上下摇晃一下,并允许我稍后滚动几次.
有关可能导致此问题的任何提示？
我写了一个网站,它有一个将用户视图滚动到页面顶部的功能.有问题的电话是:
$('html,body').animate({scrollTop:0}, 150, 'swing');
这适用于所有桌面浏览器,但在Windows Phone上,它只向用户滚动约180像素,然后停止.我试过用以下函数替换函数:
$('html,body').scrollTop(0);
它在桌面上捕捉到顶部,但它在电话上滚动到顶部.我相信Internet Explorer Mobile需要尝试平滑地滚动动画,并导致问题.如果是这种情况(或者如果没有,有人可以纠正我),我如何覆盖此功能以使动画生效？
编辑
虽然它不理想,但似乎在有限的容量下工作,我用这个替换了滚动代码:
$('html,body').animate({scrollTop:0}, 150, 'swing', function() {
$('html,body').scrollTop(0);
});
但是,如果有一个选项可以以编程方式禁用Mobile IE中的平滑滚动,那将是一件好事.
在Chrome和Safari中,$("body").scrollTop(1000)符合预期.
在IE和FF中,没有任何反应.
在IE和FF中,$(window).scrollTop(1000)可以工作,但是它们会去不同的地方.它也可以在Chrome和Safari中使用,但它们也可以在不同的地方使用.他们似乎关闭了高达300-500像素.
是否有任何一致的方法来设置跨浏览器工作的scrollTop属性,如果没有,为什么jQuery不抽象这个？
我也希望为它制作动画,这在Chrome和Safari中运行良好,但在其他浏览器中则无效.
我是浏览器检测的唯一选择吗？(不好的做法)或者有更好的方法吗？
我想放在页面的顶部,它应该将页面滚动到顶部.但是我希望滚动过程具有动画效果.我认为有可能通过使用动画但不知道如何？
请帮忙.谢谢
我写了一些简单的jQuery,让我的导航栏的背景相对于用户滚动位置从透明变为蓝色.
$(window).scroll(function(){
var range = $(this).scrollTop();
var limit = 450;
var calc = range / limit;
console.log(range);
//Bg Opacity Control
if (range === 0) {
$('.navBg').css({
opacity: 0
});
}else if(range < limit){
$('.navBg').css({
opacity: calc
});
}else if(range > limit){
$('.navBg').css({
opacity: 1
});
}
});
我的下一个任务是进行字体颜色转换.我希望颜色的更改方式与导航背景更改的方式相同(相对于用户滚动位置).我首先创建了两个包含十六进制颜色值的数组,以表示字体转换的颜色比例.
//Blue to White
var fontScale = ["#19BFFF",
"#336CFF",
"#4CCDFF",
"#66D4FF",
"#7FDBFF",
"#99E2FF",
"#B2E9FF",
"#CCF0FF",
"#E5F7FF",
"#FFF"];
//White to Gray
var hoverScale = ["#eaeaea",
"#d6d5d5",
"#c1c0c1",
"#adacac",
"#989798",
"#848283",
"#6f6e6e",
"#5a595a",
"#464445",
"#323031"]; …我有一个jQueryui对话框,我正在加载很多内容(服务条款协议),当内容溢出时会导致滚动条.这就像我希望的那样.但是,一旦对话框打开,我希望滚动条位于顶部(这样用户可以从初始化开始阅读而无需向上滚动).对话框的设置是
$(function()
{
$( "#tos_dialog" ).dialog({
title: 'Terms Of Service Agreement',
autoOpen: true,
height: 480,
width: 640,
modal: true,
show: "blind",
hide: "explode",
buttons: {
"I Accept": function() {
$( this ).dialog( "destroy" );
$("#login_container").dialog( "destroy" );
window.location.replace('/main.php');
},
"I Decline": function() {
$( this ).dialog( "destroy" );
}
}
});
我已尝试将autoOpen设置为true和false,并且我尝试了以下所有代码以尝试将内容滚动到顶部:
$("#tos_dialog").show()
$("#tos_dialog").scrollTop();
$( ".ui-dialog" ).show();
$( ".ui-dialog" ).scrollTop();
$(".ui-widget-content").show();
$(".ui-widget-content").scrollTop();
$("body").scrollTop();
$('#tos_dialog', window.parent.document).scrollTop(0);
不幸的是,以上似乎都没有起作用.我也尝试将上面的绑定事件放在对话框上,对于dialogOpen和对话框调整大小都无济于事.任何帮助将不胜感激.
你会在这个JsFiddle中看到https://jsfiddle.net/xpvt214o/402281/在窗口滚动中有另一个图像滚动.如何修改下面的内容,以便在它到达该元素之前不会开始滚动(在所有br标签之后)？我试过抵消它但没有到达任何地方.
如果滚动速度慢得多也没关系.
jQuery(document).ready(
function() {
var $w = $(window);
var $d = $('.oh');
$(window).scroll(function(event) {
var st = $w.scrollTop();
_x = st;
lastScrollTop = st;
$d.css('bottom', _x);
});
});
这是我想要实现的一个例子https://www.sketchapp.com/
scrollPositionRestoration ：'top' 不适用于 RouterModule.forchild()？angular 7 中是否有任何解决方案可以确保页面在导航后始终滚动到顶部？