如何将垂直滚动条添加到滑动选项卡?

How to add vertical scrollbar to sliding tab?

我在 http://thehungrygeek.com/ 上实现了滑动选项卡 - 即屏幕右侧的滑动抽屉。

如何使用CSS向滑动抽屉添加一个垂直滚动条,只有当访问者的显示屏高度太小时,它会切断滑动抽屉的一部分?

我尝试了以下 CSS 代码:

#tab_slide {
overflow-x: auto;
overflow-y: scroll
height:auto;       // styles added by tab-slide plugin which I am using
top:5%;            // ---- || ----
right: -303px;     // ---- || ----
width: 300px;      // ---- || ----
}

通过该代码实现,有一个垂直滚动条,但当显示高度小于标签滑动时,它不会滚动。

如何获得仅在选项卡幻灯片无法适应可用显示时才出现的可用垂直滚动条?

感谢您的帮助!

试试这个:

@media all and (max-height:400px){
  #tab_slide{
     overflow-x: auto;
     overflow-y: scroll;
  }
}

当屏幕高度更改为400px时,会出现滚动条。您可以将 max-height 更改为您想要的任何大小。

如果我没看错,那么将这些行从

#tab_slide {
 overflow-x: auto;
 overflow-y: scroll
 height:auto;       // styles added by tab-slide plugin which I am using
 top:5%;            // ---- || ----
 right: -303px;     // ---- || ----
 width: 300px;      // ---- || ----
}

收件人:

#tab_slide {
overflow-x: auto;
overflow-y: scroll
height:100%;         // **note this lines
overflow-y : auto;    // **note this lines
top:5%;            
right: -303px;     
width: 300px;      
}

如果样式是由插件添加的,您可能需要将“!important”添加到样式值中。