在HTML中制作可滚动列表区域有哪些选项?
那么要创建类似列表框的区域吗?
DIV是否有溢出:滚动最佳方法?
或者iframe更好吗?
有没有更好的新方法呢?
希望显示使用AJAX / Comet方法响应服务器“推送”更改的对象列表更新的HTML区域,并在列表更新时维护用户的滚动位置。这可以在没有“跳跃”列表的情况下完成,如果是,怎么做?
修改
我现在已经完成了一个基本的DIV解决方案。基本上使用overflow:auto(而不是overflow:scroll)似乎是静态列表和一体化更新列表的好主意。
又过了一周,我想我会尝试用户'egarcia'谈论的一些动画创意,然后我会勾选答案。
我目前正在使用当前版本的Firefox(在Windows XP和Linux上)和Internet Explorer(在Windows XP中)进行原型设计。
我正在做的DIV工作只是一个更大的博客项目的一小部分。
答案 0 :(得分:1)
据我所知,div是解决此类问题的可靠解决方案。 你永远不应该使用iframe(几乎从不)。
答案 1 :(得分:1)
带溢出的DIV:滚动是您的最佳选择。将ul
放入其中,li
元素应填入ul
。
我不确定你的“跳跃列表”是什么意思。如果你的意思是你想让列表“平稳地增长”而不是突然有很多项“突然出现”那么你必须使用javascript。
最简单的解决方案是对新项目应用“淡入”效果。 Prototype.js和Jquery具有内置的“淡入”效果。这仍然会使你的滚动条“跳跃” - 当新元素到达时它会非常快地改变大小。
一个更复杂的选项,但更好看,是在隐藏的div上制作AJAX刷新数据。刷新数据后,您可以使用该回调以“平滑”的方式“更新”“可见”div - 逐个添加所有li
项,或使用另一个平滑增长的内部div - 但您将必须在javascript中计算高度。
答案 2 :(得分:1)
我认为你应该能够将div的scrollTop属性放入你的AJAX调用中,然后在你的回调函数中设置它,这样div的滚动条就会随你移动。请参阅Mozilla关于此属性的文档:https://developer.mozilla.org/En/DOM/Element.scrollTop。 (一个iFrame看起来有点矫枉过正,div应该有效。)