在我的手机菜单中,我有<div>
带有背景SVG图像,当我打开或关闭菜单时,我会切换。出于某些原因,这张照片是以<div>
的所有宽度铺设的。有什么想法我怎么能改变它的行为?
我的HTML:
<div class="cell-6">
<div class="top-logo">LOGO</div>
</div>
<div class="cell-6" @click="showMenu = !showMenu" :class="toggleIcon">
</div>
我的JS:
toggleIcon() {
let toggle = 'hamburger';
if (this.showMenu === true) {
return toggle;
}
toggle = 'cross';
return toggle;
},
},
我的CSS:
.hamburger {
background: url('../img/hamburger.svg');
background-size: contain;
}
.cross {
background: url('../img/close.svg');
background-size: contain;
}