tedesco ad ita sito canzo by @Luigi98 - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

Referenze

<thead>Definisce un gruppo di intestazione all'interno di una tabella.
getDefinisce un metodo di invio di dati al server
classDefinisce una o più classi per elemento
<em>Formatta il testo in corsivo/italico enfatizzato
<meta>Definisce i meta dati di una pagina web.
hrefDefinisce l'URL della risorsa/pagina di destinazione.

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

basicStructure 2

esercitazione 5

Deutsch Plus [Link]

HTML: Guida Completa

HTML, CSS altre cose

esercitazione6.html

HTML

CSS

JS

terminal console

feedback

add_box Nuovo

cookie Informativa

Informativa privacy e cookies

Utilizziamo cookie o tecnologie per finalità tecniche e, con il tuo consenso, anche per altre finalità come specificato nella cookie policy. Il rifiuto del consenso può rendere non disponibili alcune funzioni. Leggi di più sull'informativa privacy

Clicca su “Accetta” per acconsentire.

<style>
.flex-container {
  display: flex;
  flex-wrap: wrap;
}


h1{text-align:center;
}

a:link{text-decoration:none;
}


 
button { /*PER TUTTI I DIV*/
    background-color:cornflowerblue;
  transition: transform 0.2s ease-in-out;
  margin:10px;
  border-radius: 10px;
  width: 150px;
  height:120px;
}

button:hover { /*PER TUTTI I DIV*/
  transform: scale(1.5);
  height:70px;}

 .highlight {
  background-color: yellow;
  font-weight: bold;
}

#cerca{
width:20px;
background-image: url("lente.jpg");
}

p{text-align:right;
}
</style>




    <input type="text" id="searchInput" oninput="searchSongs()" placeholder="Cerca qui.."><br><br><br><br>
   
    <div id="songsContainer"></div>
    

    <script>
    const songs = [
  { title: 'Übermorgen ', year: "-"+2021+"-", artist: ' Mark Forest ' , link: "https://translationsandmore.altervista.org/ubermorgen-mark-forest-2/"},
{ title: 'Neunundneunzing Luftbaloons', year: "-"+2021+"-", artist: ' Nena ' , link: "https://translationsandmore.altervista.org/99-luftballons-von-nena/"},
{ title: 'Lieblingsmensch', year: "-"+2005+"-", artist: ' Nena ' , link: "https://translationsandmore.altervista.org/lieblingsmensch-von-namika/"},
{ title: 'Señorita', year: "-"+2017+"-", artist: ' Kay One' , link: "https://translationsandmore.altervista.org/senorita-kay-one/"},
{ title: 'Portofino', year: "-"+2019+"-", artist: ' Leon Machère & Kay One ' , link: "https://translationsandmore.altervista.org/senorita-kay-one/"},
{ title: 'Du hast mich zum letzten Mal belogen', year: "-"+2007+"-", artist: ' Martin Mendes ' , link: "https://translationsandmore.altervista.org/elementor-1372/"},

 ];

 
         function createSongButton(song) {
        const button = document.createElement("button");
        button.innerText = song.title + " di " + song.artist +song.year;
        button.onclick = function() {
          window.location.href = song.link;
        };
        return button;
      }

      function displaySongs(songs) {
        const songsContainer = document.getElementById("songsContainer");
        songsContainer.innerHTML = ""; // resetta il contenuto del container

        for (let i = 0; i < songs.length; i++) {
          const songButton = createSongButton(songs[i]);
          songsContainer.appendChild(songButton);
        }
      }

      function searchSongs() {
        const searchInput = document.getElementById("searchInput");
        const searchTerm = searchInput.value.toLowerCase();

        const filteredSongs = songs.filter(function(song) {
          const title = song.title.toLowerCase();
          const artist = song.artist.toLowerCase();
          return title.includes(searchTerm) || artist.includes(searchTerm);
        });

        displaySongs(filteredSongs);
      }

      displaySongs(songs);
    </script>

*{ }