Bildergalerie mit Kommentaren

Brodel · 09.05.2010

Hallo,
Ich bin noch am anfang mit Homepage gestalltung. Darum habe ich mal eine frage ob mir jemand sagen kann wie ich eine bildergaleri mit javascript erstelle wo noch jeder besucher auf meiner seite kommentare abgeben kann.

Pixelverwender · 09.05.2010

AW: Bildergalerie mit Kommentaren

Tipp: Wordpress als Bildergalerie ? Peter Kröner, Webdesigner & Frontendentwickler
Ist zwar kein Javascript, aber ebenfalls brauchbar.

Brodel · 09.05.2010

AW: Bildergalerie mit Kommentaren

naja das ist zwar gut aber ich kann das nicht in mein web desing einbauen.
und java geht das besser aber trotzdem danke

sokie · 09.05.2010

AW: Bildergalerie mit Kommentaren

dasaknnst du getrost vergessen. mit javascript allein können die kommentare nicht gespeichert werden, du brauchst dazu eine serverseitige sprache wie zb php.

Brodel schrieb:
naja das ist zwar gut aber ich kann das nicht in mein web desing einbauen.
und java geht das besser aber trotzdem danke

was denn nun: Java oder Javascript?

Brodel · 09.05.2010

AW: Bildergalerie mit Kommentaren

also meine seite basiert auf html und mach das design mit css und da habe ich soviel rausbekomen das ich das damit nicht machen kann und suche jetzt was. was relativ einfach ist und das ich dann die kommentare habe und in mein desing ein bauen kann.

Brodel · 09.05.2010

AW: Bildergalerie mit Kommentaren

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ak 2010</title>
<link rel="stylesheet" href="design.css" type="text/css"/>

<body class="thrColFixHdr">
<div id="big">
<div id="container">
  
<div id="header">
<img src="Bilder/Kopfzeile.jpg" width="780" height="278" />
</div>
  
  
<div id="sidebar1">
  <h3><br>
  <a href="index.html">Home</a><br>
  <a href="videos.html">Videos</a><br>
  <a href="http://123gb.de/gb.php?user=Brodel">Gästebuch</a><br>
  </h3>
</div>


<div id="mainContent">
<script type="text/javascript">
<!--
// Image-Preloader
var arrImg = new Array();
arrImg[0] = new Image();
arrImg[0].src = "Bilder/Klassenphotos/1.jpg";  // Pfad zum Bild
arrImg[0].txt = "AK 2010";              // Gewünschter Text
arrImg[1] = new Image();
arrImg[1].src = "Bilder/Klassenphotos/2.jpg";
arrImg[1].txt = "Fussball 1";
arrImg[2] = new Image();
arrImg[2].src = "Bilder/Klassenphotos/3.jpg";
arrImg[2].txt = "Fussball 2";
arrImg[3] = new Image();
arrImg[3].src = "Bilder/Klassenphotos/4.jpg";
arrImg[3].txt = "Fussball 3";
arrImg[4] = new Image();
arrImg[4].src = "Bilder/Klassenphotos/5.jpg";
arrImg[4].txt = "Fussball 4";
arrImg[4] = new Image();
arrImg[4].src = "Bilder/Klassenphotos/6.jpg";
arrImg[4].txt = "Fussball 4";

// swapImage
function swapImage(imgName, intImg){
  document.getElementById(imgName+"_imgID").src = arrImg[intImg].src;
  document.getElementById(imgName+"_outID").innerHTML = arrImg[intImg].txt;

  return false;
}
</script>

<div id="imageBox">
  <img src="" alt="" height="300" width="420">
  <div id="start_outID">
</div>
</div>

<a href="#" onclick="return swapImage('start', 0);"><img src="Bilder/Klassenphotos/1.jpg" alt="load pic01" width="168" height="110"></a></li>
<a href="#" onclick="return swapImage('start', 1);"><img src="Bilder/Klassenphotos/2.jpg" alt="load pic02" width="146" height="111"></a></li>
<a href="#" onclick="return swapImage('start', 2);"><img src="Bilder/Klassenphotos/3.jpg" alt="load pic03" width="168" height="109"></a></li>
<a href="#" onclick="return swapImage('start', 3);"><img src="Bilder/Klassenphotos/4.jpg" alt="load pic04" width="167" height="107"></a></li>
<a href="#" onclick="return swapImage('start', 4);"><img src="Bilder/Klassenphotos/5.jpg" alt="load pic05" width="167" height="117"></a></li>
<a href="#" onclick="return swapImage('start', 5);"><img src="Bilder/Klassenphotos/6.jpg" alt="load pic06" width="166" height="116"></a></li>

</div>


<div id="footer">
    <p><a href="impressum.html">impressum</a></p>
</div>

</div>
</div>

</body>
</html>

das ist der Html code den ich bis her habe aber das geht nicht richtig was muss ich da noch ergänzen.

Pixelverwender · 09.05.2010

AW: Bildergalerie mit Kommentaren

Du wirst Dich da schon mit php & mySQL beschäftigen müssen, alternativ mit dem von mir angegebenen Link und der Installation von Wordpress.

sokie · 09.05.2010

AW: Bildergalerie mit Kommentaren

wie gesagt, du musst einen Weg finden, wie du die daten der Besucher(kommentare) irgendwo speicherst; wobei "irgendwo" ein platz iminternet sein muss, zB auf dem Server, auf dem auch die Seite läuft, oder einem "Datenbankserver". dafür musst Du aber eine Schnittstelle haben, die dir erlaubt mit dem Server zu kommunitzieren. In PHP ist das relativ einfach zu machen.
was du dazu brauchst (mindestens):

einen Webspace der PHP unterstützt.
ein (html)Formular für die Eingabe der daten (kommentar,name,etc)
ein php script, das die Daten auswerten kann,
eine Datei oder Datenbank in der die Daten gespeichert werden
ein script, dass die daten ausliest und als html ausgibt, sodass die kommentare auch gelesen werden können.

mySQL und/oder eine komplettes Blogsystem brauchst du nicht zwingend

ps: sei doch so gut,und benutze bitte die Codewerkzeuge für Code, sonst wird er hier unbrauchbar.

pp: dein <head> Bereich ist nicht geschlossen und nach dem Kommentar //Image-Preloader findet kein preloading statt.

Brodel · 10.05.2010

AW: Bildergalerie mit Kommentaren

// swapImage
function swapImage(imgName, intImg){
document.getElementById(imgName+"_imgID").src = arrImg[intImg].src;
document.getElementById(imgName+"_outID").innerHTML = arrImg[intImg].txt;

das weiß ich z.B. garnicht was das ist

arrImg[4] = new Image();

genau wie der befehl was der genau macht

ok danke sokie naja das haben mir viele gesagt das ich das mit php machen soll aber ich habe gesagt bekommen das ich das auch mit java script hin bekomme und das das ein wenig einfacher ist.

Brodel · 10.05.2010

AW: Bildergalerie mit Kommentaren

wenn mir da jemand sagen könnte wie man die befehle ergänzen kann