Hallo, ich versuche für eine Funktion zu erstellen, die alle Bilder innerhalb eines DIVs durch einen Link ersetzt. Durch klicken des Links sollen die Bilder dann in einem PopUp angezeigt werden.
Das ganze hat den Sinn lange Ladezeiten beim Aufrufen eines Themas in einem Forum zu verhindern.
Das Problem ist, um an den gesamten Inhalt des DIVs zu kommen muss dieses anscheinend erstmal vollständig geladen werden was natürlich die ganze Aktion überflüssig macht.
Bisher habe ich es so versucht.
Das Ergebnis ist natürlich eine Meldung, dass flipBox null ist.
Kann mir jemand helfen und sagen wie ich dieses Problem umgehe?
Das ganze hat den Sinn lange Ladezeiten beim Aufrufen eines Themas in einem Forum zu verhindern.
Das Problem ist, um an den gesamten Inhalt des DIVs zu kommen muss dieses anscheinend erstmal vollständig geladen werden was natürlich die ganze Aktion überflüssig macht.
Bisher habe ich es so versucht.
HTML:
<script type="text/javascript" language="javascript">
<!--
function imagePopUp()
{
var linkList = document.getElementById('flipBox').getElementsByTagName('a');
var str = '';
var j = 0;
for(var i;i<linkList.length;i++)
{
if(j==0)
{
str += '<tr>';
}
str += '<td><a href="'+linkList[i].href+'">'+linkList[i].innerHTML+'</a></td>';
//alert(str);
j++;
if(j==3)
{
j = 0;
str += '</tr>';
}
}
document.getElementById('flipBox').innerHTML = '<img src="popup.jpg" onclick="showPopUp('+str+')" />';
}
//-->
</script>
<div id="flipBox">
<a href="img1.jpg"><img src="preview1.jpg" /></a>
<a href="img1.jpg"><img src="preview2.jpg" /></a>
<a href="img1.jpg"><img src="preview3.jpg" /></a>
</div>
Das Ergebnis ist natürlich eine Meldung, dass flipBox null ist.
Kann mir jemand helfen und sagen wie ich dieses Problem umgehe?
Zuletzt bearbeitet: