javascript - 滚动两个 DIV,一个显示,另一个隐藏

标签 javascript jquery css

JSFiddle:https://jsfiddle.net/rq2tvccg/14/

我有 2 个包含元素的 DIV。任何时候都只显示一个 DIV(切换按钮切换它们的可见性)。我需要同时添加一个出现在两个列表中的元素。元素的 ID 是 List1_<Random>List2_<Random> .

问题是我需要将两个 DIV 滚动到刚刚添加的相应元素。但这不起作用,因为隐藏的 DIV(无论哪个)将无法正确处理这些表达式之一:

// Scroll to NEW for List 1
var elemAdded1 = $('#List1_' + id);
var pos1 = $(elemAdded1).position().top;
$("#list1").animate({scrollTop: pos1},1000); 

// Scroll to NEW for List 2
var elemAdded2 = $('#List2_' + id);
var pos2 = $(elemAdded2).position().top;
$("#list2").animate({scrollTop: pos2},1000); 

是否有滚动两个 DIV 的解决方案,这样当您切换到另一个 DIV 时,您就在预期的位置?

注意 元素可以是任意高度,它们在 List1 和 List2 中不必相同,因此我们不能依赖可见元素高度。

最佳答案

您也可以使用 opacity 风格来尝试您的代码。

试试这个 JSFiddle

关于javascript - 滚动两个 DIV,一个显示,另一个隐藏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48267023/

相关文章:

javascript - 当 Angular 完成渲染 Controller 的模板时执行一个函数

javascript - sql-developer如何通过java脚本获取表中某列的值

jQuery 选择相邻元素

css - 从左到右到右到左的反向宽度过渡

html - 切换菜单列表项显示

javascript - 如何使用 JavaScript 设置 CSS 值?

javascript - 目标容器不是使用 webpack 4 和 React 的 DOM 元素

javascript - 如何在溢出 :hidden div 中滚动更大的 div

jQuery - 数据表,如何获取列 ID

html - ie9 中的样式框 - CSS 跨浏览器问题