Aprire con un button un'altra schermata all'interno della pagina html.

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Salve a tutti , con il generoso intervento del vostro illustre criric sono venuto in possesso di questo script :

HTML:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript">
            
            function grande(img) {
                var n = document.getElementsByTagName('img').length;           
                var elemento = document.getElementById(img);
                for(var i = 1; i <= n; i++) {
                    
                    if(img == "img" + i) {                        
                        elemento.style.width = 596 + "px";
                        elemento.style.height = 435 + "px";
                    }else{
                        document.getElementById("img" + i).style.display="none";
                    }
                }                
            }            
            function piccola(img) {
                var n = document.getElementsByTagName('img').length; 
                var elemento = document.getElementById(img);
                for(var i = 1; i <= n; i++) {
                    
                    if(img == "img" + i) {                        
                        elemento.style.width = 149 + "px";
                        elemento.style.height = 109 + "px";
                    }else{
                        document.getElementById("img" + i).style.display="inline";
                    }
                }
            }
        </script>

        <style type="text/css">
            img {
                width:149px;
                height:109px;
                margin: 0 15px;
                }            }
        </style>
    </head>
    <body> 
        <div>
            <img id="img1" src="dickinson.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img2" src="newton.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img3" src="Schopenhauer.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
        </div>
        <div>
            <img id="img4" src="dickinson.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img5" src="newton.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img6" src="Schopenhauer.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
        </div>
        <div>
            <img id="img7" src="dickinson.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img8" src="newton.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img9" src="Schopenhauer.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
        </div>
           
     </body>
</html>

ed è inutile dire che funziona benissimo, io desidero adesso che con un button la schermata si sostituisca con un'altra schermata di altre 9 immagini... il procedimento è simile o devo indirizzarmi ad altro... mi basta come riferimento anche un link da cui attingere informazioni... Provo sempre ad arrivarci prima da solo. :)
Grazie. Domenico.
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
ti basta un link

Codice:
<a href='altrapagina.html'>altre immagini</a>

dove in altrapagina.html ripeterai lo script cambiando le immagini
per essere piu elegante puoi trasferire lo script in un file esterno js e richiamarlo nella head delle pagine
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Risolto :)

per chi interessa... basta andare su questa pagina : http://www.gleenk.com/navigazione-tabs-jquery/,

poi a parte la spiegazione che chiaramente è da leggere, poi andare aprire la demo e poi su visualizza sorgente pagina ed il resto è fatto, ricordatevi di aprire i link delle due jquery e salvarvele su due vostri file con lo stesso nome indicato nello script ed integrare il tutto poi nel vostro script.
E' semplicissimo , pensate ci sono riuscito al primo colpo :)
Grazie ancora a tutti e buona serata. Domenico.
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Va benissimo la tua soluzione ma ciò implica il refresh della pagina e non deve succedere ciò... :)
Perchè non va bene la mia soluzione '???
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Per cortesia sempre è possibile considerando questa parte nel <body>

HTML:
<div>
            <img id="img1" src="dickinson.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img2" src="newton.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img3" src="Schopenhauer.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
        </div>
        <div>
            <img id="img4" src="dickinson.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img5" src="newton.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img6" src="Schopenhauer.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
        </div>
        <div>
            <img id="img7" src="dickinson.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img8" src="newton.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img9" src="Schopenhauer.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
        </div>

creare un file js esterno dove andarlo ad inserire e poi richiamarlo ???
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
lo scrivi in un file con estensione .js senza tag <script type="text/javascript"> e </script>

e lo richiami nella <head>
HTML:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="nomefile.js"></script>
        <style type="text/css">
            img {
                width:149px;
                height:109px;
                margin: 0 15px;
                }         
        </style>
    </head>

fai attenzione che nel css avevi messo una graffa } in piu
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Buonasera, scusa se rispondo cosi in ritardo ma preso da altri impegni chiaramente :)
Cmq come collegare un file js me lo avete già spiegato e credo di averlo imparato..

ed ho fatto cosi per lo script in oggetto :

HTML:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

            <script type="text/javascript" src="jquery.js"></script>
            <script type="text/javascript" src="jquery-ui.min.js"></script>
        
      <script type="text/javascript">
                    
                   $(document).ready(function() {
       //Quando la pagina viene caricata
    $(".blocco-tab").hide(); //nascondi tutti i contenuti delle tabs
    $("ul.tabs li:first").addClass("active").show(); //Attiva la prima tab
    $(".blocco-tab:first").show(); //Mostra il contenuto della prima tab
 
    //Al click sulla linguetta della tab
    $("ul.tabs li").click(function() {
 
        $("ul.tabs li").removeClass("active"); //Rimuovi ogni classe "active"
        $(this).addClass("active"); //E aggiungila solo a quella su cui ho cliccato
        $(".blocco-tab").hide(); //Nascondi tutti i contenuti delle tab
 
        var activeTab = $(this).find("a").attr("href"); //Trova l'href per identificare in modo univoco la tab ed il contenuto
        $(activeTab).fadeIn(); //Mostrami quest'ultimo con effetto di fadeIn
        return false;
        });
}           );


                    

           function grande(img) {
                var n = document.getElementsByTagName('img').length;           
                var elemento = document.getElementById(img);

                for(var i = 1; i <= n; i++) {
                    
                    if(img == "img" + i) {                        
                        elemento.style.width = 596 + "px";
                        elemento.style.height = 435 + "px";
                         document.getElementById("tex" + i).style.display="none";
                           document.getElementById("text" + i).style.display="block";
                      }else{
                        document.getElementById("fot" + i).style.display="none";

                        }
                }        
       
            }   

         
            function piccola(img) {
                var n = document.getElementsByTagName('img').length; 
                var elemento = document.getElementById(img);
                
                for(var i = 1; i <= n; i++) {
                    
                    if(img == "img" + i) {                        
                        elemento.style.width = 149 + "px";
                        elemento.style.height = 109 + "px";
                          document.getElementById("tex" + i).style.display="block";
                           document.getElementById("text" + i).style.display="none";
                    }else{
                        document.getElementById("fot" + i).style.display="inline";

                   }
                   
                }
            }


        </script>

        <style type="text/css">
            img {
                width:149px;
                height:109px;
                margin: 10px 15px;
                }           

                    .area { width:140px; margin: 0px 17px; text-align :center; align=center}
                     .area1 { width:595px; margin: 0px 17px; text-align :center; align=center}
            
        </style>
    </head>
    <body>
                  <script type="text/javascript" src="fotoriquadristemmi.js"></script>

     </body>
         </html>

e nel file fotoriquadristemmi.js ho inserito questo :

HTML:
<div id="container">

               
             <div style="clear:both;"></div>
            
             <div class="contenitore_tabs">
    
                          <div id="tab1" class="blocco-tab">

     <table style="text-align: left; width: 100%;" border="1"
 cellpadding="2" cellspacing="2">
  <tbody>
    <tr> 
       
             <td align="center"><div id="fot1";><img  id="img1" src="dickinson.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="dickinson" alt="dickinson" /></br><textarea class="area" id = "tex1"; name="fine" cols="6" rows="1" style="display:block">prima</textarea><textarea class="area1" id = "text1"; name="fine" cols="16" rows="3" style="display:none">donna antica</textarea></div></td>
             <td align="center"><div id="fot2";><img  id="img2" src="newton.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" /></br><textarea class="area"; id = "tex2"; name="fine" cols="6" rows="1" style="display:block">seconda</textarea><textarea class="area1" id = "text2"; name="fine" cols="16" rows="3" style="display:none">uomo medio</textarea></div></td>  
             <td align="center"><div id="fot3";><img  id="img3" src="Schopenhauer.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" /></br><textarea class="area"; id ="tex3"; name="fine" cols="6" rows="1" style="display:block">terza</textarea><textarea class="area1" id = "text3"; name="fine" cols="16" rows="3" style="display:none">uomo vecchio</textarea></div></td>
       
     </tr>
     <tr> 
       
             <td align="center"><div id="fot4";><img  id="img4" src="dickinson.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="dickinson" alt="dickinson" /></br><textarea class="area" id = "tex4"; name="fine" cols="6" rows="1" style="display:block">prima</textarea><textarea class="area1" id = "text4"; name="fine" cols="16" rows="3" style="display:none">donna antica</textarea></div></td>
             <td align="center"><div id="fot5";><img  id="img5" src="newton.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" /></br><textarea class="area"; id = "tex5"; name="fine" cols="6" rows="1" style="display:block">seconda</textarea><textarea class="area1" id = "text5"; name="fine" cols="16" rows="3" style="display:none">uomo medio</textarea></div></td>  
             <td align="center"><div id="fot6";><img  id="img6" src="Schopenhauer.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" /></br><textarea class="area"; id ="tex6"; name="fine" cols="6" rows="1" style="display:block">terza</textarea><textarea class="area1" id = "text6"; name="fine" cols="16" rows="3" style="display:none">uomo vecchio</textarea></div></td>
       
     </tr>
           </tbody>
          </table>
           </div>
                       <div id="tab2" class="blocco-tab">

                 <table style="text-align: left; width: 100%;" border="1"
      cellpadding="2" cellspacing="2">
       <tbody>
                      <tr> 
       
             <td align="center"><div id="fot7";><img  id="img7" src="Schopenhauer.jpg"     onclick="grande(this.id);" ondblclick="piccola(this.id);" title="dickinson" alt="dickinson" /></br><textarea class="area" id = "tex7"; name="fine" cols="6" rows="1" style="display:block">prima</textarea><textarea class="area1" id = "text7"; name="fine" cols="16" rows="3" style="display:none">donna antica</textarea></div></td>
             <td align="center"><div id="fot8";><img  id="img8" src="dickinson.jpg"        onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" /></br><textarea class="area"; id = "tex8"; name="fine" cols="6" rows="1" style="display:block">seconda</textarea><textarea class="area8" id = "text2"; name="fine" cols="16" rows="3" style="display:none">uomo medio</textarea></div></td>  
             <td align="center"><div id="fot9";><img  id="img9" src="newton.jpg"           onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" /></br><textarea class="area"; id ="tex9"; name="fine" cols="6" rows="1" style="display:block">terza</textarea><textarea class="area1" id = "text9"; name="fine" cols="16" rows="3" style="display:none">uomo vecchio</textarea></div></td>
       
               </tr>
                          <tr> 
       
             <td align="center"><div id="fot10";><img  id="img10" src="newton.jpg"           onclick="grande(this.id);" ondblclick="piccola(this.id);" title="dickinson" alt="dickinson" /></br><textarea class="area" id = "tex10"; name="fine" cols="6" rows="1" style="display:block">prima</textarea><textarea class="area1" id = "text10"; name="fine" cols="16" rows="3" style="display:none">donna antica</textarea></div></td>
             <td align="center"><div id="fot11";><img  id="img11" src="dickinson.jpg"        onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" /></br><textarea class="area"; id = "tex11"; name="fine" cols="6" rows="1" style="display:block">seconda</textarea><textarea class="area1" id = "text11"; name="fine" cols="16" rows="3" style="display:none">uomo medio</textarea></div></td>  
             <td align="center"><div id="fot12";><img  id="img12" src="Schopenhauer.jpg"     onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" /></br><textarea class="area"; id ="tex12"; name="fine" cols="6" rows="1" style="display:block">terza</textarea><textarea class="area1" id = "text12"; name="fine" cols="16" rows="3" style="display:none">uomo vecchio</textarea></div></td>
       
     </tr>
           </tbody>
          </table>
           </div>     

             <table style="text-align: left; width: 100%;" border="1" cellpadding="2" cellspacing="2">
                      <tr>

            
                  
        <td><ul class="tabs"><li><a href="#tab1">Tab Numero 1</a></li></ul></td>
        <td><ul class="tabs"><li><a href="#tab2">Tab Numero 2</a></li></ul></td>
        <td><ul class="tabs"><li><a href="#tab3">Tab Numero 3</a></li></ul></td>
     </tr></table>

                      </div>

ma non mi funziona.... devo mettere qualche write document ???
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Preciso che a me interessa mettere solo quello che ho messo nel file js esterno... non la procedura sopra...
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Lo so ... nel file js esterno si può mettere solo codice script.... e allora accetto con piacere suggerimenti :)
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Mi sa che devo cambiare lo script e inserire solo i richiami Dom nei dv e quindi creare gli array nello script :)
Giusto ?
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Ok le ho provate tutte.... non ci riesco :(
Chiedo gentilmente il vostro aiuto.... posto lo script semplificato cosi vi diventa più facile... :)

HTML:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript">

  function grande(img) {
                var n = document.getElementsByTagName('img').length;           
                var elemento = document.getElementById(img);
                for(var i = 1; i <= n; i++) {
                    
                    if(img == "img" + i) {                        
                        elemento.style.width = 596 + "px";
                        elemento.style.height = 435 + "px";
                    }else{
                        document.getElementById("img" + i).style.display="none";
                    }
                }                
            }            
            function piccola(img) {
                var n = document.getElementsByTagName('img').length; 
                var elemento = document.getElementById(img);
                for(var i = 1; i <= n; i++) {
                    
                    if(img == "img" + i) {                        
                        elemento.style.width = 149 + "px";
                        elemento.style.height = 109 + "px";
                    }else{
                        document.getElementById("img" + i).style.display="inline";
                    }
                }
            }
        </script>
        <style type="text/css">
            img {
                width:149px;
                height:109px;
                margin: 0 15px;
                }            }
        </style>
    </head>
    <body> 
        <div>
            <img id="img1" src="dickinson.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img2" src="newton.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
            <img id="img3" src="Schopenhauer.jpg" onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />
        </div>

     </body>
</html>

e questo è il file di partenza, io adesso desidero creare per le immagini il solito array da poter poi portare in un file js esterno e ho tentato di fare cosi ma non funziona ....

HTML:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

            <script type="text/javascript" src="jquery.js"></script>
            <script type="text/javascript" src="jquery-ui.min.js"></script>
        
      <script type="text/javascript">

             
            var immagine = new array()

           immag[1]= "dickinson.jpg";
           immag[2]= "newton.jpg";
           immag[3]= "Schopenhauer.jpg";
           immag[4]= "dickinson.jpg";
           immag[5]= "newton.jpg";
           immag[6]= "Schopenhauer.jpg";
           immag[7]= "Schopenhauer.jpg";
           immag[8]= "dickinson.jpg";
           immag[9]= "newton.jpg";
           immag[10]= "newton.jpg";
           immag[11]= "dickinson.jpg";
           immag[12]= "Schopenhauer.jpg";


                  
                      function prendi () {
                         

                   for (var k = 1; k <immag.length+1; k++) {

                               var contn = <img  id="img[k]" src="+immag[k]+"  onclick="grande(this.id);"                     ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />

                         document.getElementById('immag').innerHTML = contn }
                                        }
                                                   prendi()


 function grande(img) {
                var n = document.getElementsByTagName('img').length;           
                var elemento = document.getElementById(img);
                for(var i = 1; i <= n; i++) {
                    
                    if(img == "img" + i) {                        
                        elemento.style.width = 596 + "px";
                        elemento.style.height = 435 + "px";
                    }else{
                        document.getElementById("img" + i).style.display="none";
                    }
                }                
            }            
            function piccola(img) {
                var n = document.getElementsByTagName('img').length; 
                var elemento = document.getElementById(img);
                for(var i = 1; i <= n; i++) {
                    
                    if(img == "img" + i) {                        
                        elemento.style.width = 149 + "px";
                        elemento.style.height = 109 + "px";
                    }else{
                        document.getElementById("img" + i).style.display="inline";
                    }
                }
            }
        </script>
        <style type="text/css">
            img {
                width:149px;
                height:109px;
                margin: 0 15px;
                }            }
        </style>
    </head>
    <body> 
        <div>
   <p id="immag"> </p>
<p id="immag"> </p>
<p id="immag"> </p>
        </div>

     </body>
</html>

Ho chiaramente il dubbio sia della sintassi sia del id="immag" dovunque.... mi aiutate per cortesia...
Grazie anticipato. Domenico
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Scusate, considerate l'array solo di tre elementi.... e senza le jquery all'inizio... copiando mi sono sfuggite... :(
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Ho escorgitato anche questa soluzione ma neanche va...


HTML:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

       
      <script type="text/javascript">

             
            var immag = new array()

           immag[1]= "dickinson.jpg";
           immag[2]= "newton.jpg";
           immag[3]= "Schopenhauer.jpg";
 
                  
                      function prendi() {
                         var t = document.getElementsByTagName('fot').length;   

           for(var i = 1; i <= t; i++) { if("fot" + i != "fot"+ 0) {
                    
                     

                               var contn = <img  id="'img'+i" src="+immag[i]+"  onclick="grande(this.id);" ondblclick="piccola(this.id);" title="titolo" alt="testo alternativo" />

                         document.getElementById('immag').innerHTML = contn } }
                                             }
                                                   prendi()

        </script>

        <style type="text/css">
            img {
                width:149px;
                height:109px;
                margin: 10px 15px;
                }           

                    .area { width:140px; margin: 0px 17px; text-align :center; align=center}
                     .area1 { width:595px; margin: 0px 17px; text-align :center; align=center}
            
        </style>
    </head>
    <body>

<table style="text-align: left; width: 100%;" border="1"
 cellpadding="2" cellspacing="2">
  <tbody>
    <tr> 
       
             <td align="center"><div id="fot1";><p id="immag"> </p></div></td>
             <td align="center"><div id="fot2";><p id="immag"> </p></div></td>  
             <td align="center"><div id="fot3";><p id="immag"> </p></div></td>
       
     </tr> </table>


     </body>
         </html>

Provate per cortesia ad aiutarmi su quest'ultimo script...
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
Buongiorno, ok lo posto ancora più semplice lo script cosi non vi rompo le scatole per solo interpretarlo...
( so di essere casinista ... )

HTML:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        
      <script type="text/javascript">

             
            var immag = new array()

           immag[1]= 'dickinson.jpg';
           immag[2]= 'newton.jpg';
           immag[3]= 'Schopenhauer.jpg';
           immag[4]= 'dickinson.jpg';
           immag[5]= 'newton.jpg';
           immag[6]= 'Schopenhauer.jpg';
           immag[7]= 'Schopenhauer.jpg';
           immag[8]= 'dickinson.jpg';
           immag[9]= 'newton.jpg';
           immag[10]= 'newton.jpg';
           immag[11]= 'dickinson.jpg';
           immag[12]= 'Schopenhauer.jpg';


                  
                      function prendi() {
                         var t = document.getElementsByTagName('fot').length; 
                        var elemento = document.getElementById(fot);  

           for(var i = 1; i <= 12; i++) { if("fot" + i != "fot" + 0) { 
                    
                                  prov = immag[i];

                               var contn = '<img src="'+ prov +'" />';

                          }  document.getElementById('immaga').innerHTML = '<img src="'+ prov +'" />'; }
                                                                
                              
                                        }
                    
                               prendi()
             
                       </script>
                    </head>
                        
                               
     <table style="text-align: left; width: 100%;" border="1"
 cellpadding="2" cellspacing="2">
  <tbody>
    <tr> 
       
             <td align="center"; id="fot1"><p id="immaga"></p></td>
             <td align="center"; id="fot2"><p id="immaga"></p></td>  
             <td align="center"; id="fot3"><p id="immaga"></p></td>
       
     </tr>
                   </table>

                   <body>
                                    
           <script type="text/javascript">
           prendi();
            
                      </script>
                        
                   </body>
           </html>

perchè non mi escono le foto ????? :((
Per favore ....
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
il tag body lo apri nel posto sbagliato

non puoi dare lo stesso id a piu tag
Codice:
<p id="immaga">

per ora non ho guardato altro
 

cavaliere123

Utente Attivo
31 Lug 2012
415
0
0
ed ok ... l'avevo immaginato.... ma non so cosa sto combinando ma mi sembra di dare i numeri... ho fatto per prova questo script e manco funziona... ma dove diamine sbaglio.... :((

HTML:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

          <script type="text/javascript">

             
            var immag = new array()

           immag[1]= "dickinson.jpg";
           immag[2]= "newton.jpg";
           immag[3]= "Schopenhauer.jpg";
                  
                      function prendi() {  
                      
                    //  imposto per prova la varibile uguale ad uno
                   
                                          var i = 1
                         
                                contn = "";
                                                                      
                              contn = '<img src="'+immag[1]+'" alt="testo alternativo" />'; 
                                   
                                                   document.getElementById('imm').innerHTML = contn;              
                                                                       }  
                                                   prendi();
             
                       </script>
             
                    </head>
     
                   <body>

               <table style="text-align: left; width: 100%;" border="1"
 cellpadding="2" cellspacing="2">

    <tr> 
       
             <td align="center"><p id="imm";></p></td>
      
     </tr>     
                           <script type="text/javascript"> prendi(); </script>
 
                   </table>                    
                      
                   </body>
           </html>

Non voglio mettere l'id = imm nel tag di <td> ... ma cosi non funziona... :(
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Array() si scrive con la A maiuscola
ripeti 2 volte la chiamata alla funzione prendi()

HTML:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript">             
            var immag = new Array();
            immag[1]= "dickinson.jpg";
            immag[2]= "newton.jpg";
            immag[3]= "Schopenhauer.jpg";
                  
            function prendi() {                       
                //  imposto per prova la varibile uguale ad uno                   
                var i = 1
                                                                      
                var contn = '<img src="'+immag[1]+'" alt="testo alternativo" />'; 
                                   
                document.getElementById('imm').innerHTML = contn;              
            }              
        </script>
    </head>
    <body>
        <table style="text-align: left; width: 100%;" border="1"
               cellpadding="2" cellspacing="2">
            <tr> 
                <td align="center"><p id="imm"></p></td>
            </tr>     
        </table>   
        <script type="text/javascript"> 
            prendi(); 
        </script>
    </body>
</html>
 

Vale2

Utente Attivo
28 Mag 2006
446
0
0
Livorno
ed ok ... l'avevo immaginato.... ma non so cosa sto combinando ma mi sembra di dare i numeri... ho fatto per prova questo script e manco funziona... ma dove diamine sbaglio.... :((

HTML:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

          <script type="text/javascript">

             
            var immag = new array()

           immag[1]= "dickinson.jpg";
           immag[2]= "newton.jpg";
           immag[3]= "Schopenhauer.jpg";
                  
                      function prendi() {  
                      
                    //  imposto per prova la varibile uguale ad uno
                   
                                          var i = 1
                         
                                contn = "";
                                                                      
                              contn = '<img src="'+immag[1]+'" alt="testo alternativo" />'; 
                                   
                                                   document.getElementById('imm').innerHTML = contn;              
                                                                       }  
                                                   prendi();
             
                       </script>
             
                    </head>
     
                   <body>

               <table style="text-align: left; width: 100%;" border="1"
 cellpadding="2" cellspacing="2">

    <tr> 
       
             <td align="center"><p id="imm";></p></td>
      
     </tr>     
                           <script type="text/javascript"> prendi(); </script>
 
                   </table>                    
                      
                   </body>
           </html>

Non voglio mettere l'id = imm nel tag di <td> ... ma cosi non funziona... :(

Ciao,

Array e no array, comunque non puoi per questo esempio istanziare un'array di tipo new.

non hai un for per scorrere gli indici, e nella variabile contn = '<img (che è già sbagliata) chiedi di visualizzare l'indice 1 (seconda immagine) immag[1]

contn = '<img modificalo con contn += '<img per visualizzare tutte le immagini.

array o

Codice:
var immag = ["dickinson.jpg","newton.jpg","Schopenhauer.jpg"]

o

Codice:
var immag = [];
immag[1]= "dickinson.jpg";
immag[2]= "newton.jpg";
immag[3]= "Schopenhauer.jpg";

cicla con il for.


Valeria.
 

Vale2

Utente Attivo
28 Mag 2006
446
0
0
Livorno
Ciao,

Codice:
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript">             
            
           //* cosi *// 

       //  var immag = ["dickinson.jpg","newton.jpg","Schopenhauer.jpg"];
            

           //* o cosi *// 

           var immag = [];
           immag[0]= "dickinson.jpg";
           immag[1]= "newton.jpg";
           immag[2]= "Schopenhauer.jpg"
                  
            function prendi() {                       
         
                contn = "";
                for (var i = 0; i < immag.length; i++) {                                                      
                contn += '<img src="'+immag[i]+'" alt="testo alternativo" /> '; 
                                   
                document.getElementById('imm').innerHTML = contn;              
            }  
}            
        </script>
    </head>
    <body>
        <table style="text-align: left; width: 100%;" border="1"
               cellpadding="2" cellspacing="2">
            <tr> 
                <td align="center"><p id="imm"></p></td>
            </tr>     
        </table>   
        <script type="text/javascript"> 
            prendi(); 
        </script>
    </body>
</html>


Valeria.
 
Discussioni simili
Autore Titolo Forum Risposte Data
D [HTML] Non riesco aprire foto singole in un album creato con "iWebAlbum" HTML e CSS 1
A [MS Access] Aprire maschera con sottomaschera su ultimo record MS Access 0
L [Javascript]Aprire div con click e chiuderlo con altro pulsante Javascript 2
R [MS Access] aprire maschera con doppio click su recordset di sottomaschera MS Access 4
M Aprire nuova scheda del browser con javascript Javascript 7
Shyson Aprire finestra popup con Safari Javascript 6
M Aprire un popup con un form jQuery 2
F Aprire un tab con js Javascript 0
A Aprire una tastiera con solo numeri Sviluppo app per Android 1
D aprire file con estensione xml e p7s? Windows e Software 0
MrClog Aprire un link da una pagina PHP con "esplora risorse" PHP 3
T aprire pdf con vba excel Programmazione 0
G Aprire indirizzo IP con desktop remoto PHP 3
M aprire una immagine da una cartella con lightbox PHP 0
A aprire pagina con form in una nuova finestra Javascript 2
novello88 Javascript opener - aprire una nuova finestra con JS Javascript 1
F Che tipo di partita iva bisogna aprire per un sito/blog con Google Adsense? Google AdSense 1
M Mac OS X - aprire file ZIP con password? Mac e Software 0
giancadeejay Aprire sito in rotazione con un bottone mi aiutate Javascript 2
G Aprire Google con php PHP 5
G Aiuto: aprire nuova finestra con variabile PHP 8
M Come aprire e salvare file di testo con Javascript? Javascript 3
M Aprire una finestra con dimensioni fisse HTML e CSS 8
V aprire contenuto spry con pulsante flash Flash 5
G Firefox come aprire link in nuova scheda con altro tasto? Windows e Software 3
S [C++] Aprire file .txt con c++ :help: C/C++ 0
P aprire/reload finestre popup con javascript Javascript 0
T come far aprire una nuova finestra con questo JS: Javascript 2
purno non aprire singole pagine in siti con frame HTML e CSS 3
ilvampiro Aprire Pagina Html Con Dimensioni Fisse E Senza Scrollbar HTML e CSS 5
W Aprire un pop-up da un pop-up HTML e CSS 3
T Come aprire file .wtb Discussioni Varie 10
A Aprire la window form Add Connection da codice Visual Basic 4
S Aprire su Mac Progetto PSD salvato su win Photoshop 0
P [Javascript] Aprire Link in Div e pagina Dinamica Javascript 0
Tommy03 Aprire un file .asp nel browser Classic ASP 5
K Aprire porte modem Tim smart Fibra Adsl e Connettività 0
ste80 [MS Access] Impossibile aprire una maschera da pulsante MS Access 2
R [MS Access] COME APRIRE UNA MASCHERA FACENDO DOPPIO CLICK SU UN RECORDSET MS Access 1
G [PHP] Aprire una cartella tramite un link PHP 1
F aprire una pagina in un overlay jQuery 0
S [PHP] Aprire file in locale PHP 1
F [Javascript] Aprire file tramite jquery Javascript 0
trattorino [Javascript] aprire blocchi via via che si scorre Javascript 0
M Salvare i dati nel db e aprire altra pagina php PHP 7
C [PHP] Aprire la pagina dopo aver fatto il login PHP 1
Morganot37 Photoshop CC non può aprire l'immagine Webdesign e Grafica 5
S Aprire un marketplace Leggi, Normative e Fisco 0
G Aprire un app da pagina web Sviluppo app per Android 3
Shaovel [HTML] Aprire sito esterno cliccando immagine HTML e CSS 7

Discussioni simili