Muy buenas, necesitaria llamar a una funcion javascript desde el evento "onclick", pero desde la parte javascript tambien, referencio el boton con documentgetelementbyId y asigno directamente el evento onclick. Pero me da error el evento, lo importante es llamar al evento desde javascript y no desde la etiqueta button de HTML.
function showHide () { // Definir elemento
let div = document.getElementById("div-servicios");
if (!div) {
// No existe, hay que crearlo
div = document.createElement("div");
div.setAttribute("id", "div-servicios");
document.body.appendChild(div);
var servicio1 = document.createElement("a");
servicio1.innerHTML = "This is a paragraph.";
servicio1.setAttribute("class","servicios");
div.appendChild(servicio1);
var servicio2 = document.createElement("a");
servicio2.innerHTML = "This is a paragraph.";
servicio2.setAttribute("class","servicios");
div.appendChild(servicio2);
var servicio3 = document.createElement("a");
servicio3.innerHTML = "This is a paragraph.";
servicio3.setAttribute("class","servicios");
div.appendChild(servicio3);
// Retardar para que aparezca con transición
setTimeout(showHide, 50);
} else {
// Mostrar u ocultar
div.classList.toggle('activo');
}
}
let boton = document.getElementById("boto-servicio").onclick = showHide;
</SCRIPT>
<STYLE>
#div-servicios {
height: 100%;
background-color:#DD9933;
color:white;
position: fixed;
z-index: 1;
right:-250px;
overflow-x: hidden;
padding-top: 30px;
transition: 1s;
width:250px;
transition:all 0.5s ease;
}
#div-servicios.activo{
right:0;
}
.servicios{
padding: 18px 18px 18px 32px;
text-decoration: none;
font-size: 25px;
color: white;
display: block;
}
#boton-servicio{}
</STYLE>