更新
This commit is contained in:
parent
24f3e1dd8f
commit
0ff08cbbc0
File diff suppressed because one or more lines are too long
@ -467,6 +467,22 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
&__slideout {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 70%;
|
||||||
|
z-index: 990;
|
||||||
|
background: var(--background);
|
||||||
|
transform: translate3d(-100%, 0, 0);
|
||||||
|
visibility: hidden;
|
||||||
|
transition: transform 0.35s, visibility 0.35s;
|
||||||
|
&.active {
|
||||||
|
visibility: visible;
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.joe_aside {
|
.joe_aside {
|
||||||
|
BIN
assets/img/wap_aside_image.jpg
Normal file
BIN
assets/img/wap_aside_image.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 330 KiB |
@ -351,13 +351,30 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||||||
/* 小屏幕伸缩侧边栏 */
|
/* 小屏幕伸缩侧边栏 */
|
||||||
{
|
{
|
||||||
$('.joe_header__above-slide').on('click', function () {
|
$('.joe_header__above-slide').on('click', function () {
|
||||||
$(this).toggleClass('active')
|
/* 关闭搜索框 */
|
||||||
|
$('.joe_header__searchout').removeClass('active')
|
||||||
|
/* 处理开启关闭状态 */
|
||||||
|
if ($('.joe_header__slideout').hasClass('active')) {
|
||||||
|
$('body').css('overflow', '')
|
||||||
|
$('.joe_mask').removeClass('active')
|
||||||
|
$('.joe_header__above-slide').removeClass("active")
|
||||||
|
$('.joe_header__slideout').removeClass("active")
|
||||||
|
} else {
|
||||||
|
$('body').css('overflow', 'hidden')
|
||||||
|
$('.joe_mask').addClass('active')
|
||||||
|
$('.joe_header__above-slide').addClass("active")
|
||||||
|
$('.joe_header__slideout').addClass("active")
|
||||||
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 小屏幕搜索框 */
|
/* 小屏幕搜索框 */
|
||||||
{
|
{
|
||||||
$('.joe_header__above-searchicon').on('click', function () {
|
$('.joe_header__above-searchicon').on('click', function () {
|
||||||
|
/* 关闭侧边栏 */
|
||||||
|
$('.joe_header__above-slide').removeClass('active')
|
||||||
|
$('.joe_header__slideout').removeClass('active')
|
||||||
|
/* 处理开启关闭状态 */
|
||||||
if ($('.joe_header__searchout').hasClass('active')) {
|
if ($('.joe_header__searchout').hasClass('active')) {
|
||||||
$('body').css('overflow', '')
|
$('body').css('overflow', '')
|
||||||
$('.joe_mask').removeClass('active')
|
$('.joe_mask').removeClass('active')
|
||||||
@ -376,6 +393,8 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||||||
$('body').css('overflow', '')
|
$('body').css('overflow', '')
|
||||||
$('.joe_mask').removeClass('active')
|
$('.joe_mask').removeClass('active')
|
||||||
$('.joe_header__searchout').removeClass('active')
|
$('.joe_header__searchout').removeClass('active')
|
||||||
|
$('.joe_header__slideout').removeClass('active')
|
||||||
|
$('.joe_header__above-slide').removeClass('active')
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
@ -257,6 +257,10 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="joe_header__slideout">
|
||||||
|
<img src="" alt="">
|
||||||
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div class="joe_mask"></div>
|
<div class="joe_mask"></div>
|
Loading…
Reference in New Issue
Block a user