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

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

Referenze

formenctypeDefinisce il tipo di codifica dei dati di un elemento input
<tr>Definisce le righe di una tabella (rows)
formactionPermette di definire l'URL di una pagina web a cui inviare i dati di un form
<thead>Definisce un gruppo di intestazione all'interno di una tabella.
loopL'attributo loop è usato per la riproduzione continua dei contenuti video e audio
<h2>Titolo di intestazione di secondo livello

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

pag. 5 progetto inf

Generatore di Musica

Form per il torneo misto dis

Nexa Digital - Web Design, AI Gene

ESERCIZIO: LE REGIONI ITALIANE E

esercitazione n. 1

Esercizi 05/03/2024 es9

Esercizi 01/03/2024 es2

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>