html溢出自动滚动,html – 溢出-y：使用overflow-x滚动：可见

参见英文答案 >

CSS overflow-x: visible; and overflow-y: hidden; causing scrollbar issue                                    6个

是否可以从垂直滚动列表中水平溢出项目？

我在这里有一个codepen示例：

http://codepen.io/baskuipers/pen/GqQYRJ

var $item = $('#1'),$button = $('.button');

$button.on("click",function() {

$item.toggleClass('addMargin');

});

.sidenav {

width: 300px;

background-color: grey;

position: fixed;

padding: 20px;

}

.addMargin {

margin-left: 60px;

}

.item {

width: 100%;

overflow-y: auto;

height: 100vh;

z-index: 5;

position: relative;

}

.sub-item {

transition: margin-left 1s cubic-bezier(0.36,-0.48,2.22);

background-color: orange;

height: 100px;

width: 100%;

margin-bottom: 10px;

z-index: 10;

position: relative;

}

body {

box-sizing: border-box;

margin: 0;

padding: 0;

}

test

在示例中,我希望将黄色项目从列表中删除.

滚动条的可见性不是问题.

有什么建议？ CSS / JavaScript？

谢谢！