我正在寻找一种方法，以防止打开叠加层“弹出部分”时主体滚动，并且仅允许在“弹出部分” div上滚动。我正在寻找使用javascript的解决方案，但是我对JS不太有经验
有没有人有什么建议？
$('#toggle-menu').click(function() {
$(this).toggleClass('active');
$('.popup-section').toggleClass('open');
$('html').toggleClass('open');
});
$('.popup-section').click(function() {
$(this).toggleClass('active');
$('.popup-section').removeClass('open');
$('.button_container').removeClass('active');
$('html').removeClass('open');
}); .popup-section{
display: none;
opacity: 0;
height: 100vh;
left: 0;
right: 0;
width: 100vw;
overflow: scroll;
}
.popup-section.open {
display: block;
opacity: 1;
z-index: 99;
}
.popup-background {
height: 100vh;
width: 100vw;
background-color: #ccbcaf;
z-index: 90;
cursor: pointer;
position: fixed;
overflow: scroll;
top: 0;
} <div class="button_container open" id="toggle-menu">
<span class="top"></span>
<span class="bottom"></span>
</div>
<div class="popup-section">
<div class="popup-background" title="">
<!--CONTENT-->
</div>
</div>我目前正在努力用文本替换播放/暂停图标，同时仍保持切换动画的方法。
我试图确切地了解哪个JS代码正在渲染图标，然后删除/隐藏它们，以便可以将它们替换为文本
我仍然是JS的初学者，非常感谢您的帮助
var tl = new TimelineMax(),
$videoContainer = $('.cb-video-container'),
$video = $videoContainer.find('.video'),
$playPauseClickArea = $videoContainer.find('.play-pause--click-area'),
$playPauseContainer = $videoContainer.find('.play-pause--container'),
$playIcon = $videoContainer.find('.play-icon'),
$pauseIcon = $videoContainer.find('.pause-icon'),
iconIsToggled = false,
iconEase = Back.easeInOut.config(1.7),
iconDuration = 0.3;
setupVideo();
// functions
function setupVideo() {
TweenMax.set($pauseIcon, {
autoAlpha: 0,
scale: 0
});
TweenMax.set($playPauseClickArea, {
backgroundColor: 'rgba(0, 0, 0, 0.5)'
})
};
function showPaused() {
iconIsToggled = true;
tl.play();
tl.to($playIcon, iconDuration, {
autoAlpha: 0,
scale: 0,
ease: iconEase
}, 0);
tl.to($pauseIcon, iconDuration, {
autoAlpha: 1, …我想在悬停时将边框自下而上过渡，但无法弄清楚如何使其工作。有什么建议？
.nav h1 {
display: inline-block;
border-bottom: 2px solid #fff;
padding-bottom: 8px;
margin: 20px;
}
.nav h1 a:hover::after {
padding-bottom: -8px;
transition: 0.5s ease-in;
}
我遇到了问题，经过大量搜索后找不到任何解决方案。
我正在使用 css 过滤器：在 div 上模糊，但它会创建深色边框，几乎就像 div 周围的小插图
我怎样才能删除这个？
我正在寻找一个不包括像上面那样增加 div 规模的解决方案
body {
margin: 0;
padding: 0;
background: #000;
}
div {
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
width:100vw;
height:100vh;
object-fit: contain;
border:none;
}
img {
width: 100%;
}<body>
<div>
<img src="https://resize.hswstatic.com/w_907/gif/tesla-cat.jpg" />
</div>
</body>