ita>ted sito by @Luigi98 - Codewith.it

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

References

placeholderDefinisce un testo segnaposto per un elemento input o textarea
<object>Incorpora risorse varie nella pagina web.
autocompleteIndica l'opzione di auto completamento delle aree di input e/o di un form
<label>Mostrare un testo di etichetta per un elemento di input.
<em>Formatta il testo in corsivo/italico enfatizzato
multipleConverte in lista a selezione multipla

Users

Log in to search for users

Explore

Find inspiration

Documentazione Tecnica

Functions: Arithmetic

fontawesome-esempio

round - social bar

PERGAMEMORY - I Segreti dei Bevill

Comunicare sul Web [Template HTML]

UX / Web Design Green – Progetto

Esercitazione WD

Product Landing Page

HTML

CSS

JS

terminal console

feedback

add_box New

cookie Policy

Privacy information and cookies

We use cookies or technologies for technical purposes and, with your consent, also for other purposes as specified in the cookie policy. Refusal of consent may make some functions unavailable. Read more about the privacy policy

Click on “Agree” to confirm.

<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta charset="utf-8">
  <meta name="generator" content="AlterVista - Editor HTML"/>
  <title>Traduzioni canzoni italiane</title>
</head>
 <style type="text/css">
 
 
 nav ul {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
}

nav li {
  flex: 1;
  text-align: center;
 
}

nav a {
  display: block;
  padding: 1em;
  text-decoration: none;
  color:black;
  font-style: normal;
  border-bottom: 3px solid transparent;
  }
 nav a:hover {
  background-color:orange;
  text-decoration:none;
  font-style: italic;
  font-size:18px;
  border-bottom: 3px solid red;
  }
 
 
 
body{background-color:gold;}
.highlight {
  background-color: yellow;
  font-weight: bold;
}
.flex-container {
  display: flex;
  flex-wrap: wrap;
}


h1{text-align:center;
}

a:link{text-decoration:none;
}


  img{
  width:40px;
  height:40px;
   border-radius: 50%;
 
  }
  
  #bandieraTedesca{
  width:30px;
    height:20px;
   border-radius: 50%; 
    }
    
button { /*PER TUTTI I DIV*/
    background-color:cornflowerblue;
  transition: transform 0.2s ease-in-out;
  margin:10px;
  border-radius: 10px;
  width: 120px;
  height:120px;
}


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

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

p{text-align:right;
}




@media only screen and (max-width: 600px) {
    
}
</style>
<body><!-- BEGIN AV_TOOLBAR --><div id="av_toolbar_regdiv" style="display:none"><div class="av_site"><a target="_blank" href="https://it.altervista.org/crea-sito-gratis.php?utm_campaign=toolbar&amp;utm_source=link&amp;utm_medium=link" title="Apri un sito gratis con Wordpress">Crea sito</a></div></div><style>@media screen and (min-width:768px){body.av-toolbar-ready{position:relative;top:40px}:where(body.av-toolbar-ready){display:flow-root}}</style><script>self.av_toolbar_off||self!==top&&"XYZZY2"!==self.name&&!self.av_toolbar_force||(document.body.classList.add("av-toolbar-ready"),document.head.appendChild(document.createElement("script")).src="https://tb.altervista.org/js/s.js")</script><!-- END AV_TOOLBAR -->






   
    <div id="songsContainer"></div>
    

    <script>
   
    const songs = [
  { title: 'Rose Rosse ', year: "-"+1968+"-", artist: ' Massimo Ranieri ' , link: "https://tecgigi.altervista.org/canzoni/roseRosse.html"},
  { title: 'Gli anni 96 ', year: "-"+1995+"-", artist: ' 883 ', link: " https://tecgigi.altervista.org/canzoni/glianni.html" },
  { title: 'Indian Tweet Posse ', year: "-"+2014+"-", artist: ' The Night Skinny ', link: "https://tecgigi.altervista.org/canzoni/Indian_Tweet_Posse.html" },
  { title: 'Quel Mazzolin di fiori ', year: "-"+2012+"-", artist: ' Le Mondine ', link: "https://tecgigi.altervista.org/canzoni/quelMazzolin.html" },
  { title: 'Furore ', year: "-"+2023+"-", artist: ' Paola e Chiara ', link: "https://tecgigi.altervista.org/canzoni/Furore.html" },
  { title: 'Fatti mandare dalla mamma ', year: "-"+1996+"-", artist: ' Gianni Morandi ', link: "https://tecgigi.altervista.org/canzoni/fattiMandaredallaMamma.html" },
{ title: 'Fetsival ', year: "-"+2002+"-", artist: ' Paola e Chiara ', link: "https://tecgigi.altervista.org/canzoni/festival.html" },
{ title: 'Ci vorrebbe un amico ', year: "-"+1984+"-", artist: ' Antonello Venditti ', link: "https://tecgigi.altervista.org/canzoni/ciVorrebbeUnAmico.html" },
{ title: 'Se lo senti lo sai ', year: "-"+2022+"-", artist: ' Jovanotti ', link: "https://tecgigi.altervista.org/canzoni/seLoSentiLoSai.html" },
{title: "Hanno ucciso l'uomo ragno ", year: "-"+1992+"-", artist: ' 883 ', link: "https://tecgigi.altervista.org/canzoni/hannoUccisoLuomoRagno.html" },
{title: "A te ", year: "-"+2008+"-", artist: ' Jovanotti ', link: "http://tecgigi.altervista.org/canzoni/Ate.html" },
 {title: "Come mai ", year: "-"+1993+"-", artist: ' 883 ', link: "http://tecgigi.altervista.org/canzoni/comeMai.html " },
{title: "Nord Sud Ovest Est ", year: "-"+1993+"-", artist: ' 883 ', link: "http://tecgigi.altervista.org/canzoni/NordSudOvestEst.html " },
{title: "Splash ", year: "-"+2023+"-", artist: ' Colapesce e Dimartino ', link: "http://tecgigi.altervista.org/canzoni/Splash.html " },
{title: "Musica leggerissima ", year: "-"+2021+"-", artist: ' Colapesce e Dimartino ', link: "http://tecgigi.altervista.org/canzoni/Musicaleggerissima.html " },
{title: "Abbronzatissima ", year: "-"+1997+"-", artist: ' Edoardo Vianello ', link: "http://tecgigi.altervista.org/canzoni/Abbronzatissima.html " },
{title: "I Giardini di Marzo ", year: "-"+1972+"-", artist: ' Lucio Battisti ', link: "http://tecgigi.altervista.org/canzoni/IGiardinidiMarzo.html " },
{title: "Saliro' ", year: "-"+2002+"-", artist: ' Daniele Silvestri ', link: "http://tecgigi.altervista.org/canzoni/Saliro.html " },  
{title: "Destinazione Paradiso ", year: "-"+1995+"-", artist: ' Gianluca Grignani ', link: "http://tecgigi.altervista.org/canzoni/destinazioneParadiso.html " },
{title: "Quando ti manca il fiato ", year: "-"+2023+"-", artist: ' Gianluca Grignani ', link: "http://tecgigi.altervista.org/canzoni/QuandoTiMancaIlFiato.html " },
 {title: "La canzone del sole ", year: "-"+1971+"-", artist: ' Lucio Battisiti ', link: "http://tecgigi.altervista.org/canzoni/LaCanzoneDelSole.html " },
{title: "Un bel viaggio ", year: "-"+2023+"-", artist: ' Articolo 31 ', link: "http://tecgigi.altervista.org/canzoni/UnbelViaggio.html " },
{title: "Bocca di Rosa ", year: "-"+1967+"-", artist: ' Fabrizio De Andrè ', link: "http://tecgigi.altervista.org/canzoni/BoccadiRosa.html " },
 {title: "7:40 ", year: "-"+1971+"-", artist: ' Lucio Battisiti ', link: "http://tecgigi.altervista.org/canzoni/740.html " },
 {title: "Sono solo parole ", year: "-"+2011+"-", artist: ' Noemi ', link: "https://tecgigi.altervista.org/canzoni/sonoSoloParole.html " },
 {title: "I migliori anni della nostra vita ", year: "-"+1995+"-", artist: ' Renato Zero ', link: "https://tecgigi.altervista.org/canzoni/IMiglioriAnni.html " },
{title: "Alice ", year: "-"+1975+"-", artist: ' Francesco De Gregori ', link: "https://tecgigi.altervista.org/canzoni/Alice.html " },
{title: "Cenere ", year: "-"+2023+"-", artist: ' Lazza ', link: "https://tecgigi.altervista.org/canzoni/cenere.html" },
{title: "Supereroi ", year: "-"+2023+"-", artist: ' Mr. Rain ', link: "https://tecgigi.altervista.org/canzoni/supereroi.html" },


 ];

 
         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>
  </body>
</html>

*{ }