0
在帶有流體容器的可滾動頁面上,fancybox模式存在問題。 在下面的例子中,當你打開模式fancybox背景的右側時會稍微拉伸一些,因爲新模式沒有垂直滾動條。模態關閉後,背景大小再次被修正。Fancybox 3和響應式背景
.container {
margin: 40px;
padding: 20px;
height: 200vh;
background-color: bisque;
transition: 3s all linear;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.1.20/jquery.fancybox.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.1.20/jquery.fancybox.min.css" rel="stylesheet"/>
<div class="container">
<div>
Some content
</div>
<a data-fancybox data-src="#hidden-content" href="javascript:;">
Open fancybox
</a>
</div>
<div style="display: none;" id="hidden-content">
\t <h2>Hello</h2>
\t <p>You are awesome.</p>
</div>