SEMI al FUTURO [Fotogallery] by @marco_ballarin - Codewith.it

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

Referenze

loopL'attributo loop è usato per la riproduzione continua dei contenuti video e audio
<source>Il tag HTML <source> si usa per indicare una o più risorse multimediali per elementi media
actionDetermina la pagina di destinazione a cui verranno inviati i dati di un form HTML
colspanDefinisce il numero di colonne di una cella all'interno di una tabella.
Inserisce un commento nel codice
<input>Definisce un area di input per l'invio di dati e informazioni

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

Generatore di Musica

Ricetta Cous Cous

esercitazione n.1

copia dicountdownfineanno

un casino pazzesco

HTML - Esercizi

benvenuti nella mia scuola

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.

<!DOCTYPE html>
<html lang="it">
  <head>
    <title>SEMI al FUTURO Action Seven!</title>
    <link rel="icon" type="image/x-icon" href="http://pcto-minisiti.netsons.org/wp-content/uploads/Icona.png">
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width" />
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.css"/>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
      body {
        background-color:rgba(24, 24, 27, 0.98);
      }
      .div-header {
        display:flex;
      }
      .div-title {
        color:white;
        text-align:left;
        font-family:Lato, Helvetica, sans-serif;
        font-size:20px;
        padding:10px;
        width:50%;
      }
      .div-icon {
        text-align:right;
        font-size:20px;
        padding:10px;
        width:50%;
      }
      .a-icon {
        color:white;
      }
      .div-gallery {
        display:none;
      }
    </style>
  </head>
  <body>
    <div class="div-header">
      <div class="div-title">Galleria di foto</div>
      <div class="div-icon">
      <a class="a-icon" href="https://pcto-minisiti.netsons.org/semi-al-futuro-action-seven.html#gallery-1">
      <i class="fa-sharp fa-solid fa-rotate-right"></i>
      </a>
      </div>
    </div>
    <div class="div-gallery">
      <a data-fancybox="gallery" href="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-1-scaled.jpg">
      <img src="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-1-scaled.jpg"/>
      </a>
      <a data-fancybox="gallery" href="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-5-scaled.jpg">
      <img src="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-5-scaled.jpg"/>
      </a>
      <a data-fancybox="gallery" href="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-2-scaled.jpg">
      <img src="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-2-scaled.jpg"/>
      </a>
      <a data-fancybox="gallery" href="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-4-scaled.jpg">
      <img src="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-4-scaled.jpg"/>
      </a>
      <a data-fancybox="gallery" href="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-3-scaled.jpg">
      <img src="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-3-scaled.jpg"/>
      </a>
      <a data-fancybox="gallery" href="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-6.jpg">
      <img src="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-6.jpg"/>
      </a>
      <a data-fancybox="gallery" href="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-7.jpg">
      <img src="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-7.jpg"/>
      </a>
      <a data-fancybox="gallery" href="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-8.jpg">
      <img src="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-8.jpg"/>
      </a>
      <a data-fancybox="gallery" href="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-9.jpg">
      <img src="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-9.jpg"/>
      </a>
      <a data-fancybox="gallery" href="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-10.jpg">
      <img src="http://pcto-minisiti.netsons.org/wp-content/uploads/SEMI-al-FUTURO-Action-Seven-10.jpg"/>
      </a>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.umd.js"></script>
    <script>
      Fancybox.bind('[data-fancybox="gallery"]', {
        Carousel : {
          infinite: false,
        }
      });   
    </script>
  </body>
</html>