2015-04-02 74 views
4

我不知道是否有一种方法,通过CSS或JavaScript,强制滚动条出现在网站内容的顶部(如z-index 9999),而不是将所有元素移动到左侧? 我的设计包括左侧的空白区域,无论分辨率或屏幕大小如何,所以与滚动条出现/消失时滚动条施加的向左/向右移动相比,这不会成为问题。在页面内容上强制滚动条?

如果没有,我会简单地用溢出-Y得到:滚动的方法,但另一种解决方案将是一件好事,如果可能的:)

谢谢您的回复!

+0

正品问题:为什么?看起来几乎不可想象,你有一个非常特殊的网站,它不能遵守“滚动条在桌面浏览器中的工作方式”=) – 2015-04-02 06:33:50

+0

该网站没有什么特别之处,它只是在JavaScript中有几个动画/转换,当滚动条出现/消失时,滚动条全部向左/向右移动,看上去对我来说看起来真的很麻烦,所以我只是想知道是否有内置或简单的方法不遵守滚动条的工作方式,但也可以使用其他方式能行得通 :) – user3149431 2015-04-03 08:17:59

回答

0

正如Mike'Pomax'Kamermans已经提到的那样......滚动条移动内容是非常基本的浏览器行为,不应该让任何人感到困扰。尽管如此,我们可以通过使用一些js或jquery使它看起来好像滚动条出现在内容的上方。

这个想法是添加填充来替换滚动条,而您的内容不溢出。例如:

// If there is no scrollbar, add some padding to replace it. 
if ($(document).height() > $(window).height()) { 
    $('body').css('padding', 'none'); 
} else { 
    $('body').css('padding', '0 '+scrollbarwidth+'px 0 0'); 
} 

查看此jsfiddle作为一个工作示例。

注意:有一些闪烁,而我无法修复调整大小。这似乎与窗口宽度有关。也许别人可以找出是什么原因造成的。