滚动查看动画
滚动查看动画
提问于 2012-08-24 09:24:15
我的代码在http://jsfiddle.net/mannagod/QT3v5/7/。
JS是：
function delay() {
var INTENDED_MONTH = 7 //August
// INTENDED_MONTH is zero-relative
now = new Date().getDate(),
rows = document.getElementById('scripture').rows;
if (new Date().getMonth() != INTENDED_MONTH) {
// need a value here less than 1,
// or the box for the first of the month will be in Red
now = 0.5
};
for (var i = 0, rl = rows.length; i < rl; i++) {
var cells = rows[i].childNodes;
for (j = 0, cl = cells.length; j < cl; j++) {
if (cells[j].nodeName == 'TD'
&& cells[j].firstChild.nodeValue != ''
&& cells[j].firstChild.nodeValue == now) {
// 'ffff99' // '#ffd700' // TODAY - red
rows[i].style.backgroundColor = 'red'
rows[i].scrollIntoView();
}
}
}
}我需要找到一种方法来平滑.scrollintoview()。现在，它“跳转”到突出显示的行。我需要它平滑地过渡到那一行。它需要用动态的方式来替代scrollintoview。有什么想法吗？谢谢。
回答 7
Stack Overflow用户
发布于 2016-03-23 22:03:18
在大多数现代浏览器(Chrome and Firefox, but not Safari, UC, or IE)中，您可以将对象中的选项传递给.scrollIntoView()。
试试这个：
elm.scrollIntoView({ behavior: 'smooth', block: 'center' })其他值为behavior: 'instant'、block: 'start'或block: 'end'。请参阅https://developer.mozilla.org/en/docs/Web/API/Element/scrollIntoView
Stack Overflow用户
发布于 2015-09-09 23:47:12
我也在搜索这个问题，找到了这个解决方案：
$('html, body').animate({
scrollTop: $("#elementId").offset().top
}, 1000);资源：http://www.abeautifulsite.net/smoothly-scroll-to-an-element-without-a-jquery-plugin-2/
Stack Overflow用户
发布于 2013-04-23 21:55:45
也许你不想仅仅为了实现这个特性而添加jQuery。elem是要滚动的元素。目标位置可以从要移动到视图中的元素的offsetTop属性中获取。
function Scroll_To(elem, pos)
{
var y = elem.scrollTop;
y += (pos - y) * 0.3;
if (Math.abs(y-pos) < 2)
{
elem.scrollTop = pos;
return;
}
elem.scrollTop = y;
setTimeout(Scroll_To, 40, elem, pos);
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12102118
复制相关文章
相似问题