Pagina 1 di 2 1 2 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 12
  1. #1
    Utente di HTML.it
    Registrato dal
    Jan 2017
    Messaggi
    9

    offline ok, online non funziona

    Salve,
    ho fatto questa pagina per gestire immagini in miniatura e in originale sulla stessa pagina.
    Funziona offline ma online no.

    Come posso controllare online?

    Questo il codice usato:
    codice HTML:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <meta content="text/html; charset=windows-1252" http-equiv="content-type">    <link rel="stylesheet" href="./gallery.css">    <script type="text/javascript" src="./onpage.js.download"></script>    <title>Esposizioni</title>  </head>  <body>    <div id="container">      <div id="gallery">        <div style="margin:10px; 10px"> <img alt="" src="index_html_files/13008.png">          <a href="PRINCIPALI  MOSTRE PERSONALI.html"><img src="index_html_files/13019.png"
                  alt="" border="0" height="35" width="71"></a>          <!-- <img alt="" src="index_html_files/13019.png"><br>  --> <img alt=""
                src="index_html_files/esposizioni.png"><br>          <!-- h3 da lasciare se no apre galleria su altra pagina!! -->          <h3 id="titolo"> </h3>          <img src="./vuoto.jpg" id="bigimage" alt="" style="top: 0px; margin-top: 22px;"
                align="right" height="347" width="317"> </div>        <div id="minipics">          <table style="height: 500px; width: 888px; margin-left: 15px;" border="1">            <tbody>              <tr>                <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        Nozze di Psyche alla mostra La Favorita<br>                        e il coccodrillo, Palazzo Tè,<br>                        Mantova maggio 1987<br>                  <a href="./13022.jpg"><img src="./13010.jpg">                  </a></td>                <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        Una sala della mostra Contrappunto,<br>             Palazzo Racani Aroni,<br>            Spoleto luglio-agosto1997<br>                  <a href="./13028.jpg"> <img src="./13016.jpg">                  </a></td>                <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        L’ingresso alla mostra L’orecchio di Dioniso<br>                        e una sala, Fortezza Firmaede,<br>                        Sarzana settembre 2004<br>                  <a href="./13024.jpg"> <img src="./13012.jpg">                  </a></td>              </tr>              <tr>                <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        Una sala della mostra Escatologica,<br>                        Magazzini del sale,<br>                        Siena maggio-giugno 1998<br>                  <a href="./13023.jpg"><img src="./13011.jpg"> </a></td>                <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        Prima sala della mostra Ritorno a Itaca,<br>                        Museo Ala Ponzone,<br>                        Cremona ottobre 2006-gennaio 2007<br>                  <a href="./13025.jpg"><img src="./13013.jpg"> </a></td>                <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        Seconda sala della mostra Ritorno a Itaca,<br>                        Museo Ala Ponzone,<br>                        Cremona ottobre 2006-gennaio 2007<br>                  <a href="./13026.jpg"><img src="./13014.jpg"> </a></td>              </tr>              <tr>                <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        Arpe marine,<br>                        Galleria Arte 92<br>                        Milano ottobre-novembre 2008<br>                <a href="./13021.jpg"><img src="./13009.jpg"> </a></td>                <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        Scorie alla mostra Non si riposa il mare,<br>                        Spazio Oberdan,<br>                         Milano settembre – novembre 2012<br>                <a href="./13027.jpg"><img src="./13015.jpg"> </a></td>                <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        Transiti e incontri,<br>                        Museo Diocesano,<br>                        Milano giugno-agosto 2014<br>                <a href="./2014_Milano_Diocesano.jpg"><img src="./2014_Milano_Diocesano2.jpg"> </a></td>              </tr>              <tr>               <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        Concerto per Sofonisba,<br>                        Museo del violino<br>                        Cremona aprile-giugno 2016<br>                <a href="./2016_Cremona.png"><img src="./2016_Cremona2.png"> </a></td>               <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        D'Acqua, di musica, di cielo<br>                        Villa Carlotta,<br>                        Tremezzo luglio-settembre 2016<br>                <a href="./2016_Tremezzo_Villa_Carlotta.png"><img src="./2016_Tremezzo_Villa_Carlotta2.png"></a></td>               <td style="text-align: center; vertical-align: middle; white-space: nowrap;">                        Sotto un altro cielo,<br>                        Galleria San Fedele,<br>                        Milano aprile-maggio 2016<br>                <a href="./2016_San_Fedele.jpg"><img src="./2016_San_Fedele2.jpg"> </a></td>              </tr>            </tbody>          </table>        </div>      </div>    </div>  </body></html>
    questo gallery.css:
    codice HTML:
    html{margin:0;padding:0}body{font: 12px arial,sans-serif;margin:0;padding: 0 5px}img{border:0}div#container{width:1400px}div#header img{float:left}div#header h2{float:left;margin:54px 0 0 0;font-size:100%}div#zoom{float:right;margin:0 0 5px 0;padding: 5px;border:1px solid #ccc}div#zoom h3{margin:0;font-size:100%;color: #666;text-align:center}div#zoom img{display:block;width:400px;height:400px}div#minipics{margin-right:715px}div#minipics ul{list-style-type: none;margin: 0;padding: 0}div#minipics li{float:left;margin:0 15px 15px 15px;border:1px solid #ccc;padding: 3px}
    Questo onpage.js.download:
    codice HTML:
    window.onload=function(){if(!document.getElementById || !document.getElementsByTagName) return;links=document.getElementById("minipics").getElementsByTagName("a");for(i=0;i<links.length;i++)    links[i].onclick=function(){Show(this);return(false)}}
    function Show(obj){bigimg=document.getElementById("bigimage");bigimg.src=obj.getAttribute("href");smallimg=obj.getElementsByTagName("img")[0];t=document.getElementById("titolo");t.removeChild(t.lastChild);t.appendChild(document.createTextNode(smallimg.title));}
    grazie per l'aiuto

  2. #2
    Amministratore L'avatar di Vincent.Zeno
    Registrato dal
    May 2003
    residenza
    Emilia-Romagna (tortellini und cappelletti land!)
    Messaggi
    20,783
    ciao,
    formatta correttamente il codice, altrimenti è impossibile tentare di aiutarti.

  3. #3
    Utente di HTML.it
    Registrato dal
    Jan 2017
    Messaggi
    9
    Ho riscritto il tutto usando lo <span> adesso ho un problema diverso...vorrei che quando esco dalla miniatura venisse chiusa l'immagine originale, questo il nuovo codice:
    codice HTML:
    <html>  <head>    <meta content="text/html; charset=windows-1252" http-equiv="content-type">    <style type="text/css">
    .thumbnail{position: relative;z-index: 0;}
    .thumbnail:hover{background-color: transparent;z-index: 50;}
    .thumbnail span{ /*carateristiche dell'immagine ingandita e del testo relativo*/
    position: absolute;/*relative invece di absolute per posizione relativa foto piccola*/ 
    background-color: lightyellow;/*colore sfondo della foto*/
    padding: 5px;/*cornice*/
    visibility: hidden;color: black;text-decoration: none;}
    .thumbnail span img{ /*caratteristiche dell'img ingrandita*/
    border-width: 0;padding: 10px;}
    .thumbnail:hover span{ /*posizione dell'img ingrandita*/
    visibility: visible;
    }
    </style>
    </head>
      <body>
    <a class="thumbnail" href="#thumb"><img src="13009.jpg" border="0">
                                                  <span><img src="13021.jpg"><br>Nome Foto 1</span></a>
    <a class="thumbnail" href="#thumb"><img src="13009.jpg" border="0">
                                                 <span><img src="13021.jpg"><br>Nome Foto 2</span></a>    <br>    
    <a class="thumbnail" href="#thumb"><img src="13009.jpg" border="0">
                                                 <span><img src="13021.jpg"><br>Nome Foto 3</span></a>    <br>  
    </body>
    </html>

  4. #4
    Amministratore L'avatar di Vincent.Zeno
    Registrato dal
    May 2003
    residenza
    Emilia-Romagna (tortellini und cappelletti land!)
    Messaggi
    20,783
    hai dimenticato scrivere il file js o non c'è più?

  5. #5
    Utente di HTML.it
    Registrato dal
    Jan 2017
    Messaggi
    9
    non c'è più, fatto tutto solo con css e html

  6. #6
    Utente di HTML.it
    Registrato dal
    Jan 2017
    Messaggi
    9
    Quote Originariamente inviata da gino.o Visualizza il messaggio
    non c'è più, fatto tutto solo con css e html
    Altra domanda...è possibile fare lo zoom cliccando un link normale e che anche qui si chiuda la foto originale quando non sono più sul link?

    Grazie

  7. #7
    Amministratore L'avatar di Vincent.Zeno
    Registrato dal
    May 2003
    residenza
    Emilia-Romagna (tortellini und cappelletti land!)
    Messaggi
    20,783
    Quote Originariamente inviata da gino.o Visualizza il messaggio
    Ho riscritto il tutto usando lo <span> adesso ho un problema diverso...vorrei che quando esco dalla miniatura venisse chiusa l'immagine originale, questo il nuovo codice:
    l'ho provato e funziona

  8. #8
    Utente di HTML.it
    Registrato dal
    Jan 2017
    Messaggi
    9

    Come vedi il mouse non è più sulla miniatura e la foto grande è rimasta aperta...

  9. #9
    Utente di HTML.it
    Registrato dal
    Jan 2017
    Messaggi
    9

    risolto!

    Riscritto completamento...adesso funziona!

    css:
    codice HTML:
    span{  font-size: 12px;  font-family: Verdana;}
    #livello{  background-color: #FFFFCC;  font-size: 10px;  padding: 5px;  border: Solid 1px #000000;}
    a{color: #0000FF;  text-decoration: None;}
    a:hover{color: #FF0000;  text-decoration: Underline;}
    js:
    codice HTML:
    function Mostra(testo)
    {  
    livello.innerHTML = testo; // IMPOSTA IL TESTO NEL LIVELLO  
    livello.style.visibility = "Visible"; // MOSTRA IL LIVELLO  
    livello.style.position = "Absolute"; // POSIZIONA IL LIVELLO IN MODALITA' ASSOLUTA 
    livello.style.left = event.clientX + 15; // IMPOSTA LE COORDINATE IN ORIZZONTALE  
    livello.style.top = event.clientY + 15; // IMPOSTA LE COORDINATE IN VERTICALE
    }
    function Nascondi()
    {  
    livello.style.visibility = "Hidden"; // NASCONDE IL LIVELLO
    }

  10. #10
    Utente di HTML.it
    Registrato dal
    Jan 2017
    Messaggi
    9

    risolto!

    .
    Ultima modifica di gino.o; 03-02-2017 a 15:30 Motivo: problemi formattazione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.