simplebar滚动删除溢出隐藏选项
simplebar滚动删除溢出隐藏选项
提问于 2018-12-07 17:04:24
我在下面的位置使用滚动条。它工作得很好。https://grsmto.github.io/simplebar/
请看我的小提琴。在我的演示中，我在video/image上显示了列表。如果我点击视频或图像，它应该是放大的。我是由css实现的。单击应放大的第一张图像。但放大的视频或图像将被隐藏。我希望图像或视频应该是重叠的滚动条也推下面的元素。这可能吗？http://jsfiddle.net/akn1r638/
$(".viewenlarge").click(function(){
$(".video").addClass("expand");
});回答 1
Stack Overflow用户
发布于 2018-12-07 17:50:33
http://jsfiddle.net/akn1r638/27/
$(".video").click(function(){
$(this).css("width","250px");
$(".content").css("margin-top", "20px");
$(".image").css("margin-top", "20px");
});.demo1 {
height: 250px;
width: 250px;
}
.left-panel {
width: 250px;
background: #000;
color: #fff;
}
.video{
background-image:url('https://www.fujifilmusa.com/products/digital_cameras/x/fujifilm_x20/sample_images/img/index/pic_09.jpg');
background-size:contain;
background-repeat:no-repeat;
height:200px;
width:200px;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="left-panel">
<div class="demo1" data-simplebar>
<div >
<h2>Scroll me!</h2>
<p class="video viewenlarge"></p>
<p class="image"><img src= "https://www.fujifilmusa.com/products/digital_cameras/x/fujifilm_x20/sample_images/img/index/pic_08.jpg"></p> <p class="content">Some more content</p>
<p class="odd">Some content</p>
<p>Some more content</p>
<p class="odd">Some content</p>
<p>Some more content</p>
<p class="odd">Scroll me!</p>
hey!
</div>
</div>
</div>
请查看更新后的小提琴，稍微修修补补就能让你做到这一点。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53666288
复制相关文章
相似问题
腾讯云开发者
