Spoiler.. (sostituituire un link con una immagine..)

Allora.. In rete ho trovato questo codice:-
Inserendo nella pagina questo coso:-

<script type="text/javascript" src="http://folliacity.netsons.org/noncancellare/showhide.js"></script>

dove si trovano queste due righe di codice comparià un link che servirà per aprire e chiudere lo spoiler

<div id="commenti" class="toggle">
<p> testo </p>
</div>

Fino a qui è tutto ok, ma il contenuto del file showhide.js è il seguente:-

if(document.getElementById && document.createElement){
document.write('<style type="text/css">*.toggle{display:none}</style>');
window.onload=function(){
    /*le modifiche allo script vanno solo fatte qui*/
    Attiva("commenti","Mostra il testo","Nascondi il testo");
    Attiva("immagine","visualizza immagine","nascondi immagine");
    }
}

function Attiva(id,s1,s2){
var el=document.getElementById(id);
el.style.display="none";
var c=document.createElement("div");
var link=document.createElement("a");
link.href="#";
link.appendChild(document.createTextNode(s1));
link.onclick=function(){
    link.firstChild.nodeValue = (link.firstChild.nodeValue==s1) ? s2 : s1;
    el.style.display=(el.style.display=="none") ? "block" : "none";
    return(false);
    }
c.appendChild(link);
el.parentNode.insertBefore(c,el);
} 

Nella riga di codice

    Attiva("commenti","Mostra il testo della canzone","Nascondi il testo della canzone"); 

è possibile sostituire le scritte "Mostra il testo" e "Nascondi il testo" con due immagini?
Grazie in anticipo..

[dementialsite]

Puoi provare così: all'interno della funzione Attiva:

- sostituisci la sesta riga con questa:

link.innerHTML = s1;

- sostituisci l'ottava riga con questa:

link.innerHTML = (link.innerHTML == s1) ? s2 : s1;

Puoi quindi chiamare la funzione Attiva inserendo i tag HTML delle immagini che vuoi inserire, e questi verranno inseriti correttamente...

Stammi bene...

Non va..

if(document.getElementById && document.createElement){
document.write('<style type="text/css">*.toggle{display:none}</style>');
window.onload=function(){
    /*le modifiche allo script vanno solo fatte qui*/
    Attiva("commenti",<img src="http://i70.photobucket.com/albums/i103/tuffdsc/Italia%20Canora/mlt_f.jpg">,<img src="http://i70.photobucket.com/albums/i103/tuffdsc/Italia%20Canora/mlt_f.jpg">);
    link.innerHTML = s1;
    }
}

function Attiva(id,s1,s2){
link.innerHTML = (link.innerHTML == s1) ? s2 : s1;
el.style.display="none";
var c=document.createElement("div");
var link=document.createElement("a");
link.href="#";
link.appendChild(document.createTextNode(s1));
link.onclick=function(){
    link.firstChild.nodeValue = (link.firstChild.nodeValue==s1) ? s2 : s1;
    el.style.display=(el.style.display=="none") ? "block" : "none";
    return(false);
    }
c.appendChild(link);
el.parentNode.insertBefore(c,el);
} 

[karl94]

Hai fatto un po' di confusione, questo è il codice corretto.

if(document.getElementById && document.createElement){
document.write('<style type="text/css">*.toggle{display:none}</style>');
window.onload=function(){
    /*le modifiche allo script vanno solo fatte qui*/
    Attiva("commenti","<img src=\"http://i70.photobucket.com/albums/i103/tuffdsc/Italia%20Canora/mlt_f.jpg\" />", "<img src=\"http://i70.photobucket.com/albums/i103/tuffdsc/Italia%20Canora/mlt_f.jpg\" />");
    }
}

function Attiva(id,s1,s2){
var el=document.getElementById(id);
el.style.display="none";
var c=document.createElement("div");
var link=document.createElement("a");
link.href="#";
link.innerHTML = s1;
link.onclick=function(){
    link.innerHTML = (link.innerHTML == s1) ? s2 : s1;
    el.style.display=(el.style.display=="none") ? "block" : "none";
    return(false);
    }
c.appendChild(link);
el.parentNode.insertBefore(c,el);
} 

grazie.. :)

edit: il contenuto del div è molto pesante e quindi rallenta il caricamento della pagina.. è possibile far caricare il contenuto all'apertura?