Bildergalerie

[Manu]

Hallo,

ich habe mir aus dem Internet eine kostenlose Bildlaufleiste für meine Homepage geholt. Alles schön und gut und diese funktioniert auch super. Nun ist es aber da so, dass sich die Bilder in einem neuen Fenster öffnen. Ich würde sie aber gerne unterhalb der Leiste auf der gleichen Seite natürlich in Originalgröße aufrufen können. Momentan steh ich ziemlich auf dem Schlauch, wie ich die Bilder unterhalb der Leiste bei Klick auf die Thumbs sehen kann. Habe schon sehr viel durchgelesen und glaube, dass ich es mit einem Javascript machen könnte. Nur wie!?

Ich wäre euch für Hilfe sehr sehr dankbar.

Gruß

      <script type="text/javascript"><!--  
var sliderwidth = 550; // Breite des Sliders  
var sliderheight = 105; // Höhe des Sliders  
var slidespeed = 2; // Geschwindigkeit des Sliders  
var slidebgcolor = "#FFFFFF"; // Hintergrundfarbe  
var leftrightslide = new Array();  
var copyspeed = slidespeed;  
var i = 0;  
/* HIER DIE LINKS UND BILDER ANPASSEN*/  
leftrightslide[i++] = '<a href="1.JPG"><img src="../Temp/1.jpg"></a>';  
leftrightslide[i++] = '<a href="2.jpg"><img src="../Temp/2.jpg"></a>';  
leftrightslide[i++] = '<a href="3.jpg"><img src="../Temp/3.jpg"></a>';  
leftrightslide[i++] = '<a href="4.html"><img src="../Temp/4.jpg"></a>';  
leftrightslide[i++] = '<a href="5.html"><img src="../Temp/5.jpg"></a>';  
leftrightslide[i++] = '<a href="6.html"><img src="../Temp/6.jpg"></a>';  
leftrightslide[i++] = '<a href="7.html"><img src="../Temp/7.jpg"></a>';  
leftrightslide[i++] = '<a href="8.html"><img src="../Temp/8.jpg"></a>';  
leftrightslide[i++] = '<a href="9.html"><img src="../Temp/9.jpg"></a>';  
leftrightslide[i++] = '<a href="10.html"><img src="../Temp/10.jpg"></a>';  
leftrightslide[i++] = '<a href="11.html"><img src="../Temp/11.jpg"></a>';  
leftrightslide[i++] = '<a href="12.html"><img src="../Temp/12.jpg"></a>';  
leftrightslide[i++] = '<a href="13.html"><img src="../Temp/13.jpg"></a>';  
leftrightslide[i++] = '<a href="14.html"><img src="../Temp/14.jpg"></a>';  
leftrightslide[i++] = '<a href="15.html"><img src="../Temp/15.jpg"></a>';  
leftrightslide[i++] = '<a href="16.html"><img src="../Temp/16.jpg"></a>';  
leftrightslide[i++] = '<a href="17.html"><img src="../Temp/17.jpg"></a>';  
leftrightslide[i++] = '<a href="18.html"><img src="../Temp/18.jpg"></a>';  
leftrightslide[i++] = '<a href="19.html"><img src="../Temp/19.jpg"></a>';  
leftrightslide[i++] = '<a href="20.html"><img src="../Temp/20.jpg"></a>';  
leftrightslide[i++] = '<a href="21.html"><img src="../Temp/21.jpg"></a>';  
leftrightslide[i++] = '<a href="22.html"><img src="../Temp/22.jpg"></a>';  
leftrightslide[i++] = '<a href="23.html"><img src="../Temp/23.jpg"></a>';  
leftrightslide[i++] = '<a href="24.html"><img src="../Temp/24.jpg"></a>';  
leftrightslide[i++] = '<a href="25.html"><img src="../Temp/25.jpg"></a>';  
leftrightslide[i++] = '<a href="26.html"><img src="../Temp/26.jpg"></a>';  
leftrightslide[i++] = '<a href="27.html"><img src="../Temp/27.jpg"></a>';  
leftrightslide[i++] = '<a href="28.html"><img src="../Temp/28.jpg"></a>';  
leftrightslide[i++] = '<a href="29.html"><img src="../Temp/29.jpg"></a>';  
leftrightslide[i++] = '<a href="30.html"><img src="../Temp/30.jpg"></a>';  
leftrightslide[i++] = '<a href="31.html"><img src="../Temp/31.jpg"></a>';  
leftrightslide[i++] = '<a href="32.html"><img src="../Temp/32.jpg"></a>';  
leftrightslide[i++] = '<a href="33.html"><img src="../Temp/33.jpg"></a>';  
leftrightslide[i++] = '<a href="34.html"><img src="../Temp/34.jpg"></a>';  
leftrightslide[i++] = '<a href="35.html"><img src="../Temp/35.jpg"></a>';  
leftrightslide[i++] = '<a href="36.html"><img src="../Temp/36.jpg"></a>';  
leftrightslide[i++] = '<a href="37.html"><img src="../Temp/37.jpg"></a>';  
leftrightslide[i++] = '<a href="38.html"><img src="../Temp/38.jpg"></a>';  
leftrightslide[i++] = '<a href="39.html"><img src="../Temp/39.jpg"></a>';  
leftrightslide[i++] = '<a href="40.html"><img src="../Temp/40.jpg"></a>';  
leftrightslide[i++] = '<a href="41.html"><img src="../Temp/41.jpg"></a>';  
leftrightslide[i++] = '<a href="42.html"><img src="../Temp/42.jpg"></a>';  
leftrightslide[i++] = '<a href="43.html"><img src="../Temp/43.jpg"></a>';  
/* AB HIER NICHTS MEHR ÄNDERN */  
leftrightslide = '<nobr>' + leftrightslide.join("") + '</nobr>';  
var iedom = document.all || document.getElementById;  
if (iedom)  
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-3000px">' + leftrightslide + '</span>');  
var actualwidth = '';  
var cross_slide, ns_slide;  
function fillup(){  
if (iedom){  
cross_slide=document.getElementById? document.getElementById("test2") : document.all.test2;  
cross_slide2=document.getElementById? document.getElementById("test3") : document.all.test3;  
cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide;  
actualwidth=document.all? cross_slide.offsetWidth : document.getElementById("temp").offsetWidth;  
cross_slide2.style.left=actualwidth+20+"px";  
}  
else if (document.layers){  
ns_slide=document.ns_slidemenu.document.ns_slidemenu2;  
ns_slide2=document.ns_slidemenu.document.ns_slidemenu3;  
ns_slide.document.write(leftrightslide);  
ns_slide.document.close();  
actualwidth=ns_slide.document.width;  
ns_slide2.left=actualwidth+20;  
ns_slide2.document.write(leftrightslide);  
ns_slide2.document.close();  
}  
lefttime=setInterval("slideleft()",30);  
}  
function slideleft(){  
if (iedom){  
if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))  
cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px";  
else  
cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+"px";  
if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))  
cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px";  
else  
cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+"px";  
}  
else if (document.layers){  
if (ns_slide.left>(actualwidth*(-1)+8))  
ns_slide.left-=copyspeed;  
else  
ns_slide.left=ns_slide2.left+actualwidth;  
if (ns_slide2.left>(actualwidth*(-1)+8))  
ns_slide2.left-=copyspeed;  
else  
ns_slide2.left=ns_slide.left+actualwidth;  
}  
}  
if (iedom||document.layers){  
with (document){  
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>');  
if (iedom){  
document.write('<div style="position:relative;width:' + sliderwidth + 'px;height:' + sliderheight + 'px;overflow:hidden">');  
document.write('<div style="position:absolute;width:' + sliderwidth + 'px;height:' + sliderheight + 'px;background-color:' + slidebgcolor + '" onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed">');  
document.write('<div id="test2" style="position:absolute;left:0;top:0"></div>');  
document.write('<div id="test3" style="position:absolute;left:-1000;top:0"></div>');  
document.write('</div></div>');  
}  
else if (document.layers){  
document.write('<ilayer width='+sliderwidth+' height='+sliderheight+' name="ns_slidemenu" bgColor='+slidebgcolor+'>');  
document.write('<layer name="ns_slidemenu2" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>');  
document.write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>');  
document.write('</ilayer>');  
}  
document.write('</td></table>');  
}  
}  
//-->  
      </script><br>  
      <div id="kostenlosejavascripts" align="center"><a  
 href="http://www.kostenlose-javascripts.de/dsl-anbieter-vergleich.html"  
 title="g&uuml;nstige Internetanbieter" target="_blank">g&uuml;nstige  
Internetanbieter</a></div>  
      <br>  
      <script type="text/javascript"  
 src="http://www.kostenlose-javascripts.de/startScript.php?id=234"></script>  

[mbaiti]

Habe schon sehr viel durchgelesen und glaube, dass ich es mit einem Javascript machen könnte. Nur wie!?

Das Problem wird dann sein das sich die Seite bei jedem klick auf ein neues Bild selbst auch neu lädt. Um das zu umgehen musst du dich ein wenig mit dem Thema AJAX auseinandersetzten.

gruß,
matt

[Manu]

Habe schon sehr viel durchgelesen und glaube, dass ich es mit einem Javascript machen könnte. Nur wie!?

Das Problem wird dann sein das sich die Seite bei jedem klick auf ein neues Bild selbst auch neu lädt. Um das zu umgehen musst du dich ein wenig mit dem Thema AJAX auseinandersetzten.

gruß,
matt

Hallo,

okay zugegeben, mit AJAX hab ich noch wie was am Hut gehabt! Aber im Grunde lässt sich das dann schon realisieren was ich möchte? Oder wäre es dann doch einfacher, wenn ich eine Galerie erstelle ohne Javascript?

Gruß
Manu

[Felix Riesterer]

Liebe Manu,

zwei Kritikpunkte:

1.) Du hättest netterweise die URLs korrigieren können. So scheint Dein Anliegen eine versteckte Werbung für Deine Seite zu sein.

2.) Java oder gar JSP haben mit JavaScript nichts(!) zu tun.

Das Problem wird dann sein das sich die Seite bei jedem klick auf ein neues Bild selbst auch neu lädt.

Das Problem lässt sich mit JavaScript verhindern.

Um das zu umgehen musst du dich ein wenig mit dem Thema AJAX auseinandersetzten.

Das ist nicht wahr. Ich behaupte sogar, dass AJAX hier ein recht unsinniger Lösungsansatz ist. Eine Art Lightbox-Script hätte hier mehr Sinn.

Aber im Grunde lässt sich das dann schon realisieren was ich möchte?

Ja.

Oder wäre es dann doch einfacher, wenn ich eine Galerie erstelle ohne Javascript?

Ja.

Was willst Du nun? Ich kann Dir zweierlei anbieten.
1.) Bilderticker
2.) jsPopup

Die beiden Scripts kann man auch kombinieren - habe ich aber noch nicht gemacht. Das wäre ein Ansatz, um Dich mehr mit JavaScript auseinanderzusetzen... ;-)

Liebe Grüße,

Felix Riesterer.

[Manu]

Liebe Manu,

zwei Kritikpunkte:

1.) Du hättest netterweise die URLs korrigieren können. So scheint Dein Anliegen eine versteckte Werbung für Deine Seite zu sein.

»»
Entschuldige, daran hab ich nicht wirklich gedacht war keinerlei Absicht oder Werbung für die Seite, ich bin eher halb am verzweifeln damit.

2.) Java oder gar JSP haben mit JavaScript nichts(!) zu tun.

»»
Auch sorry beim nächsten mal werd ich es anders machen :-)

Das Problem lässt sich mit JavaScript verhindern.

Also doch!Hm...

Was willst Du nun? Ich kann Dir zweierlei anbieten.
1.) Bilderticker
2.) jsPopup

Die beiden Scripts kann man auch kombinieren - habe ich aber noch nicht gemacht. Das wäre ein Ansatz, um Dich mehr mit JavaScript auseinanderzusetzen... ;-)

»»Ich würde gern einfach etwas einfaches haben, wo ich Bilder in einer Galerie setze, diese sich so auf der selben Seite öffnen, dass ich zusätzlich noch am schluss für die Besucher der Seite ein Button für Kommentare bereitstellen kann.

Gruß Manu

[Felix Riesterer]

Liebe Manu,

Ich würde gern einfach etwas einfaches haben

zu welchem Preis? Falls Dich diese Frage jetzt überrascht, lies nochmal die Charta, insbesondere den letzen Absatz der Einleitung ("Gemeint ist damit, dass sich SELFHTML nicht an Leute richtet, die alles fertig vorgesetzt bekommen wollen.").

Liebe Grüße,

Felix Riesterer.

[Manu]

Liebe Manu,

Ich würde gern einfach etwas einfaches haben

zu welchem Preis? Falls Dich diese Frage jetzt überrascht, lies nochmal die Charta, insbesondere den letzen Absatz der Einleitung ("Gemeint ist damit, dass sich SELFHTML nicht an Leute richtet, die alles fertig vorgesetzt bekommen wollen.").

Mir gehts nicht darum dinge vorgesetzt zu bekommen, natürlich will ich es selber erstellen, es ist ja meine Homepage, darum ja auch die frage ob es nicht einfacher wäre, eine Galerie ohne Javascript zu erstellen! Für die Antwort bin ich schon sehr dankbar gewesen. Deshalb werde ich es nun anders aufbauen!

Gruß Manu

[hotti]

hi,

[..] darum ja auch die frage ob es nicht einfacher wäre, eine Galerie ohne Javascript zu erstellen!

Eine Lösung ohne JS bevorzuge ich. Weil: jede Einzelseite, die ein Foto zeigt, hat einen URI, das lässt sich verbookmarken und googlen. Meine Galerien sind zwar damit losgelöst von der Stammseite, haben aber auf jeden Fall einen Link dahin.

Realisiert hab ich meine Fotoalben mit einem Perl/CGi-Script.

Horst

[Patrick Andrieu]

Hallo Manu!

Mir gehts nicht darum dinge vorgesetzt zu bekommen, natürlich will ich es selber erstellen, es ist ja meine Homepage, darum ja auch die frage ob es nicht einfacher wäre, eine Galerie ohne Javascript zu erstellen! Für die Antwort bin ich schon sehr dankbar gewesen. Deshalb werde ich es nun anders aufbauen!

Felix verlinkt gerne eigene Arbeiten, leider nur ausschließlich seine (jaja, Felix...).

Bildergalerien gibt es zuhauf, einige funktionieren mit und ohne JavaScript, mit Perl oder PHP:

http://forum.de.selfhtml.org/archiv/2009/3/t185128/#m1231563

Und nochmals danke an dedlfix für den PHP-Part in diesem Thread (@dedlfix: ich komme leider nicht dazu, mir Gedanken zu einem Artikel zu machen...)

Viele Grüße aus Frankfurt/Main,
Patrick

[suit]

2.) Java oder gar JSP haben mit JavaScript nichts(!) zu tun.

Das hatten wir doch schon - es gibt einige Beziehungen und Gemeinsamkeiten :)