我有一个动画,其中标题淡出然后一些内容淡入,我对动画的速度有一点问题.
无论我做什么我都无法改变fadeIn方法的速度效果？动画与此完美结合.似乎无法弄明白 - 任何想法？
$(document).ready(function() {
$('.aboutQuery').click(function() {
$('.mySec').fadeOut('slow', function() {
$('.aboutText').fadeIn(5000);
})
})
}).mySec {
display: block;
position: relative;
height: calc(95vh);
width: calc(96vw - 1vh);
transform: translate(calc((4vw + 1vh) / 2), 2.5vh);
overflow: hidden;
}
.aboutText {
padding-left: 5vw;
padding-right: 5vw;
font-size: 2vw;
white-space: pre-line;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div class="header">
<ul id="headList">
<li>
<a class="aboutQuery" id="link" href="#">ABOUT</a>
</li>
<li>
<a id="link" href="#">CLASSES</a>
</li>
<li>
<a id="link" href="#">CONTACT</a>
</li>
</ul>
<div class="mySec">
<div class="info">
<h1 class="title">Niki Gibbs Modern Pilates</h1> …我正在尝试使用 HTML、CSS 和 Jquery 构建音频播放器。我在使用 Jquery 的“悬停”方法时遇到了问题。当“背景图像”被删除时，它似乎将 div 向下移动 - 为什么会这样？我知道这与页面的流程有关。想我应该从头开始重新启动音频播放器，因为它有太多问题。我应该只使用 CSS 悬停吗？
这是直播网站的链接
$('.music-box').hover(function() {
$('.music-box').css("border", "1px solid black");
$('.music-box').css("background", "none");
$('.player').css('display', 'block');
$('.music-details').css('display', 'block');
$('.buyDiv').css('display', 'block');
});
$('.music-box').mouseleave(function() {
$('.music-box').css("border", "none");
$('.music-box').css("background", "url('junction.jpg')");
$('.music-box').css("background-size", "contain");
$('.music-box').css("background-repeat", "no-repeat");
$('.player').css('display', 'none');
$('.music-details').css('display', 'none');
$('.buyDiv').css('display', 'none');
}); .junction {
display: inline;
padding: 2vw;
}
.music-box {
background: url(junction.jpg);
background-size: contain;
background-repeat: no-repeat;
position: relative;
width: 16vw;
cursor: pointer;
height: 30vh;
display: inline-block;
}
.music-details {
display: none;
position: relative; …