我正在开发“时间轴”元素,其中列表项内有内容,位于水平无序列表中。它包含在 div 中,因此您可以从左向右滚动内容。
我的客户想要“转到”每个时代的按钮。我知道这可以通过 JavaScript 轻松实现。然而他们也希望在没有 JavaScript 的情况下也能正常工作。我尝试为每个元素添加 anchor ,但这并没有真正起作用,因为您无法控制浏览器想要最终到达的确切位置。使用带有水平滚动的 anchor 是非常有问题的。
有什么想法吗?
最佳答案
当 JavaScript 不可用时,使用垂直时间线(整个页面滚动,无内部滚动条)。 anchor 在这种情况下效果相当好。实现此目的的一个简单方法是使折叠列表及其包含的 div 的样式依赖于 DOM 层次结构中较高的类,并在加载时 使用 JavaScript。比如,
.jsEnabled .containingDiv { height: 10em; overflow: auto; }
.jsEnabled .timelineList li { width: 6em; float: left; }
...
function loadTimeStuff()
{
// enable styles that require JS-assisted scrolling
document.body.className = "jsEnabled";
// ...
}
当然,它看起来不会像成熟的 JS 增强页面那么奇特,但它是一个后备 - 如果用户想要奇特的东西,他们只需要使用支持 JavaScript 的浏览器...
关于javascript - 如何在不使用 JavaScript 的情况下使浏览器将元素水平滚动到预定义位置?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1971786/