Soy principiante y estoy haciendo una barra lateral, usé JsHint para verificar el error del código js, se muestra el siguiente error, pero la barra lateral está funcionando, guíe para corregir el error
este fue el error
Two unused variables 1 openFunction 5 closeFunctionY aquí está mi código
<div class="hamburger"> <a href="javascript:void(0)"><i id="bars" onclick="openFunction();" class="fas fa-bars" aria-hidden="true"></i></a> </div> <!---------------------Sidebar---------------------------> <div id="bg-sidenav" onclick="closeFunction();" class="bg-sidebar"> </div> <div id="sidebar-cont" class="sidebar-content"> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </div>Y aquí está el código Javascript
function openFunction(){ document.getElementById('sidebar-cont').style.width = "220px"; document.getElementById('bg-sidenav').style.width = "100%"; } function closeFunction() { document.getElementById('sidebar-cont').style.width = "0"; document.getElementById('bg-sidenav').style.width = "0"; }Como dijo @Sebastian Simon en su comentario, use addEventListener para adjuntar sus controladores:
<div class="hamburger"> <a href="javascript:void(0)"><i id="bars" class="fas fa-bars" aria-hidden="true"></i></a> </div> <!---------------------Sidebar---------------------------> <div id="bg-sidenav" class="bg-sidebar"> </div> <div id="sidebar-cont" class="sidebar-content"> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </div>Y encuentre los elementos en el DOM y luego adjunte los controladores usando JavaScript:
function openFunction(){ document.getElementById('sidebar-cont').style.width = "220px"; document.getElementById('bg-sidenav').style.width = "100%"; } function closeFunction() { document.getElementById('sidebar-cont').style.width = "0"; document.getElementById('bg-sidenav').style.width = "0"; } document.addEventListener("DOMContentLoaded", () => { const barsElement = document.getElementById('bars'); const sidenavElement = document.getElementById('bg-sidenav'); bars.addEventListener('click', openFunction); sidenavElement.addEventListener('click', closeFunction); });