2010-06-23 155 views
9

我有一个隐藏的div,具有固定高度和滚动条。我想改变滚动位置,但浏览器不会让我这样做,因为div是隐藏的。 scrollTop属性将坚持为0.更改隐藏div的滚动

此外,我不想显示和隐藏div,导致闪烁。

如果有人知道如何去做,它会非常有帮助。

谢谢!

+0

当您取消隐藏时,您不能更改滚动位置吗? – NibblyPig 2010-06-23 10:40:08

回答

2

我的问题并不完整。 div并不是自己隐藏的。它是隐藏的容器div的一部分。内部div显示与他的父母。

<div class="container hidden"> 
    <div id="some_div">Content</div> 
    <div id="my_div">I wanted to scroll this one</div> 
    <div id="other_div">Content</div> 
</div> 

我们使用jQuery想出了一个自定义的“onShow”事件。

所以现在我们可以这样做:

$('#my_div').bind('show', function() { 
    handle_scrollTopOffset(); 
}); 

当show事件被绑定,就增加了类.onShow到div。 jQuery.fn.show()函数已被覆盖,触发具有.onShow类的孩子的'show'事件。

谢谢大家的建议。对不起,我提供了一个不完整的问题。下次我会提供所有的细节。

+0

这是我找到的最佳解决方案。我只是将scrollTop()函数从我的关闭函数移到了我的开头函数中,而不是事件。 – stackers 2015-08-19 15:52:11

2

为了防止格闪烁和修复<div>不可用性脚本可以使用位置隐藏的"display: none;"代替:

.hidden { 
    position: absolute !important; 
    left: -9999px !important; 
    top: -9999px !important; 
} 
3

您可以使用jQuery的数据功能保存滚动。

function SaveScroll(val) 
{ 
    $(the_element).data("Scroll", val); 
} 

function Show() 
{ 
    var element = $(the_element); 

    // prevent from showing while scrolling 
    element.css 
    ({ 
     position: "absolute", 
     top: "-50000px", 
     left: "-50000px", 
     display: "" 
    }); 

    // Scroll to the position set when it was hidden 
    element.scrollTop(element.data("Scroll")); 

    // show the element 
    element.css 
    ({ 
     position: "", 
     top: "", 
     left: "" 
    }); 
} 

这可能做的伎俩


你也许可以只使用visibility: hidden,而不是display: none。可见性将元素保留在原来的位置。我相信它和opacity: 0完全一样,但它是一个跨浏览器的解决方案。