前提・実現したいこと
javascriptでボタンを押すとサイドバーが出る仕組みを実装したい
発生している問題・エラーメッセージ
サイドバーが表示されない
該当のソースコード
html
1 <div id="open"> 2 <i class="fas fa-bars open-btn"></i> 3 </div> 4 <div id="side-bar"> 5 <div id="close"> 6 <i class="fas fa-times fa-2x"></i> 7 </div> 8 </div>
css
1#side-bar{ 2 display:none; 3} 4 5#side-bar.active{ 6 display:block; 7}
javascript
1'use strit'; 2const open = document.getElementById('open'); 3const close = document.getElementById('close'); 4const sideBar = document.getElementById('side-bar'); 5const body = document.querySelector('body'); 6 7open.addEventListener('click',()=>{ 8 sideBar.classList.add('active'); 9}); 10 11close.addEventListener('click',()=>{ 12 sideBar.classList.remove('active'); 13}); 14body.addEventListener('click',()=>{ 15 sideBar.classList.remove('active'); 16});
補足情報(FW/ツールのバージョンなど)
#openをつけた領域をクリックするとサイドバーが現れ、side-barの中の#closeをクリックするとsidebarがきえるようにしたいです。
javascriptのコードを書いた経験あまりないので基本的な間違いが原因なら申し訳ございません
回答1件
あなたの回答
tips
プレビュー