Intentando hacer un menú desplegable donde agrego una imagen de menú de hamburguesas como botón. ¿Cómo puedo agregar la imagen al botón? El botón/imagen está diseñado para mostrar un menú desplegable, que se puede usar para navegar por la página web.
// header const headerContent = () => { const header = document.getElementById("header"); //logo bilde const img = document.createElement("img"); img.id = "logo"; img.src = "BANNER/logo.png"; img.alt = "Logo"; //handlekurven const divHandlekurv = document.createElement("img"); divHandlekurv.src = "IKON/shoppingbagikon.png"; divHandlekurv.id = "handlekurv"; //burgermenyen const divDropdown_menu = document.createElement("div"); divDropdown_menu.className = "dropdown_menu"; const menu_bar = document.createElement("button"); menu_bar.input = "image"; menu_bar.src = "IKON/burgerikon.png"; menu_bar.id = "burgerknapp"; //const menuikon = document.createElement("img"); // menuikon.src = "IKON/burgerikon.png"; //kategoriene i burgermenyen const menu_content = document.createElement("div"); menu_content.className = "content"; const menu_content1 = document.createElement("a"); menu_content1.href = "omflo.html"; menu_content1.textContent = "blabla"; const menu_content2 = document.createElement("a"); menu_content2.href = "produkter.html"; menu_content2.textContent = "Produkter"; const menu_content3 = document.createElement("a"); menu_content3.href = "betingelser.html"; menu_content3.textContent = "Betingelser"; //elementer lagt til i header menu_content.appendChild(menu_content1); menu_content.appendChild(menu_content2); menu_content.appendChild(menu_content3); menu_bar.appendChild(menu_content); //divDropdown_menu.appendChild(menuikon); divDropdown_menu.appendChild(menu_bar); header.appendChild(divDropdown_menu); header.appendChild(img); header.appendChild(divHandlekurv); }; headerContent();Puede configurar el fondo de la imagen del botón o puede agregar un detector de eventos de clic en la imagen y ejecutar la funcionalidad del botón en su devolución de llamada.
img.addEventListener("click", function(){ //your functionality });Puede crear un botón y establecer una imagen de fondo. Por ejemplo:
input.button { border:0; background-color: transparent; background-image: URL(your-image-path); background-repeat: no-repeat; width: your-image-width; height: your-image-height; }