我有下面的菜單,當前從左側滑入并從左側覆蓋屏幕的 30%。如何使這張幻燈片從右側進入并固定在屏幕的右側?我曾嘗試將 CSS 行“left:-150%”更改為“right:-150px”,但這只會導致菜單在您打開菜單時淡入淡出...我還希望在菜單打開時禁用頁面滾動...謝謝!jQuery(document).ready(function($){ $('.btn-open-menu').click(function () { $('header').addClass('open'); }); $('.link-menu').click(function () { $('header').removeClass('open'); }); $('.btn-close-menu').click(function () { $('header').removeClass('open'); });});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><header> <a class="btn-open-menu"> <span class="hamburguer"><img src="/wp-content/uploads/2020/08/hamburger.png"</span> </a> <div class="header-content"> <a class="btn-close-menu"></a> <nav> <div class="Menu"> <ul class="Menu-list" data-offset="10"> <li class="Menu-list-item" data-offset="20" onclick="location.href='/home';"> Home <span class="Mask"><span>Home</span></span> <span class="Mask"><span>Home</span></span> </li> <li class="Menu-list-item" data-offset="16" onclick="location.href='/about';"> About <span class="Mask"><span>About</span></span> <span class="Mask"><span>About</span></span> </li> <li class="Menu-list-item" data-offset="12" onclick="location.href='/contact';"> Contact <span class="Mask"><span>Contact</span></span> <span class="Mask"><span>Contact</span></span> </li> </ul></div> </nav> <div class="social"> <a href="https://www.instagram.com/jvaleskasilva/" target="_blank"> <i class="fab fa-instagram"></i> </a> <a href="https://www.facebook.com/jvaleskasilva" target="_blank"> <i class="fab fa-facebook-f"></i></i> </a> </div> </div></header>
菜單從右側滑入并固定在頁面右側
嚕嚕噠
2022-12-29 14:10:14