nicht angemeldet
Bildergalerie in PHP einbinden
Hallo
Habe grosses Problem.
Ich soll auf einer PHP Seite eine Bildergallerie einbinden, mit vorwärts/rückwärts Pfeilen. Noch dazu sollte sich zu jedem geklickten Bild eine Bildlegende generieren. Also immer für jedes Bild immer neu.
Von der Optik sollten die Pfeile nur aus "<" und ">" bestehen.
Kann mir jemand helfen??
Anpassung an die Seite:
-------------------
| |
| Bilder |
| |
| |
|_____________________| < >
Bildlegende
So sollte das aussehen
Danke danke danke (solang mir jemand hilft ;)
Liebe Grüsse
sarah
-
Grüße,
könntest du die Frage etwas umformen da ich zugeben muss keine frage erkannt zuhaben
(was hat das ganze mit KS zu tun?)MFG
bleicher--
__________________________-
Menschen an sich , sind nicht schlecht - es sind nur ihre Taten (c).
Lieber bereuen gesündigt zu haben, als nicht sündigen und es später trotzdem bereuen.
Boccaccio-
Ich brauche einfach einen COde für Die Bildergallerie, und am besten noch für diesen Kommentar, der sich auch generieren lässt..
Oder bin ich einfach zu blöd?
Hab momentan einen Code, den hier.. :
<script>
var myImages = new Array();
myImages[1] = new Image();
myImages[1].src = "pics/Projekte/1_2_1.jpg";
myImages[2] = new Image();
myImages[2].src = "pics/Projekte/1_2_2.jpg";
myImages[3] = new Image();
myImages[3].src = "pics/Projekte/1_2_3.jpg";
myImages[4] = new Image();
myImages[4].src = "pics/Projekte/1_2_4.jpg";
myImages[5] = new Image();
myImages[5].src = "pics/Projekte/1_2_5.jpg";var maxValue = myImages.length - 1;
var intValue = 1;
function gallerie(charValue) {
if(charValue == 'c') {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[intValue].src + "'>";
}
else if(charValue == '+') {
if(intValue == maxValue) {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[1].src + "'>";
intValue = 1;
}
else {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[intValue + 1].src + "'>";
intValue = intValue + 1;
}
}
else if(charValue == '-') {
if(intValue == 1) {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[maxValue].src + "'>";
intValue = maxValue;
}
else {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[intValue - 1].src + "'>";
intValue = intValue - 1;
}
}
}</script>
<div id="logo"></div>
<body onload="gallerie('c')">
<table border="1">
<tr>
<td><a href="#" onclick="gallerie('-')">< </a></td>
<td><div id="imgGallerie"></div></td>
<td><a href="#" onclick="gallerie('+')">></a></td>
</tr>
</table></body>
liebe Grüsse
Sarah
PS: Frauen und Technik ;)
-
Ich brauche einfach einen COde für Die Bildergallerie, und am besten noch für diesen Kommentar, der sich auch generieren lässt..
Naja, den Javascript-Code hast Du ja schon. Jetzt mache daraus erstmal eine HTML-Seite:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Meine tolle Galerie</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <!-- weitere meta-Angaben --> <script type="text/javascript">var myImages = new Array();
myImages[1] = new Image();
myImages[1].src = "pics/Projekte/1_2_1.jpg";
myImages[2] = new Image();
myImages[2].src = "pics/Projekte/1_2_2.jpg";
myImages[3] = new Image();
myImages[3].src = "pics/Projekte/1_2_3.jpg";
myImages[4] = new Image();
myImages[4].src = "pics/Projekte/1_2_4.jpg";
myImages[5] = new Image();
myImages[5].src = "pics/Projekte/1_2_5.jpg";var maxValue = myImages.length - 1;
var intValue = 1;
function gallerie(charValue) {
if(charValue == 'c') {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[intValue].src + "'>";
}
else if(charValue == '+') {
if(intValue == maxValue) {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[1].src + "'>";
intValue = 1;
}
else {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[intValue + 1].src + "'>";
intValue = intValue + 1;
}
}
else if(charValue == '-') {
if(intValue == 1) {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[maxValue].src + "'>";
intValue = maxValue;
}
else {
document.getElementById("imgGallerie").innerHTML = "<img src='" + myImages[intValue - 1].src + "'>";
intValue = intValue - 1;
}
}
}</script> <body onload="gallerie('c')"> <div id="imgGallerie"></div> <p id="navigation"> <span onclick="gallerie('-')"> < </span> <span onclick="gallerie('+')"> > </span> </p> </body> </html>Wenn die HTML-Seite soweit funktioniert, können wir uns über die optische Verschönerung der Seite und über die Bildunterschriften unterhalten. Und wenn das alles zu Deiner Zufriedenheit läuft, wirst Du wie schon viele andere vor Dir erkennen, dass Dein Anliegen absolut nichts mit PHP zu tun hat :)
PS: Frauen und Technik ;)
Pah, faule Ausrede!
Siechfred
--
Wir vom Moderatorenteam haben keinerlei Humor, von dem wir wüssten.-
Hallo
Also das mit der Seite funktioniert schon gut, die Gallerie ist einfach erweiterbar, alles wunderbar.
Probleme habe ich nur mit der Bildunterschrift. Die brauche ich unbedingt.Und das Design der Seite muss auch noch besser werden. aber sonst alles tiptop.
Also, Frage: Wie kriege ich die Bildunterschrift???????
liebe Grüsse Sarah
-
Grüße,
Also, Frage: Wie kriege ich die Bildunterschrift???????
aus dem grünen wenn die küken mozart.
sieh frage oben - WIE sind die Bechriftungen gespeichert?
MFG
bleicher--
__________________________-
Menschen an sich , sind nicht schlecht - es sind nur ihre Taten (c).
Lieber bereuen gesündigt zu haben, als nicht sündigen und es später trotzdem bereuen.
Boccaccio-
Hallo Bleicher
Die Bilduntertitel sind gar nicht gespeichert. bzw. noch nicht. Ich denke ich folge den Anweisungen von Sechfried, "string" etc. sagt mir nur bahnhof..
Danke!!mfg
sarah
-
-
Also, Frage: Wie kriege ich die Bildunterschrift???????
Speichere sie im Bild-Array:
var myImages = new Array(); myImages[1] = { 'src' : 'pics/Projekte/1_2_1.jpg', 'dsc' : 'Tolles Bild' }; myImages[2] = { 'src' : 'pics/Projekte/1_2_2.jpg', 'dsc' : 'Ein noch tolleres Bild' };usw.
Zugriff erhältst Du wie gewohnt via myImages[intValue].src (Bild-URL) bzw. myImages[intValue].desc (Bildbeschreibung). Das ganze könntest Du dann so einfügen:
var HTMLcode = "<img src='" + myImages[intValue].src + "'><p>" + myImages[intValue].dsc + "</p>";Viel Erfolg.
Siechfred
--
Wir vom Moderatorenteam haben keinerlei Humor, von dem wir wüssten.-
SUPER.. Mensch der absolute Wahnsinn!!
Werd's ausprobieren und meld mich dann nochmaldanke unterdessen.. JIHA
glg
sarah-
Super klappt alles.
Mein nächstes Problem wäre noch die Darstellung.
habe mit einfachen <font>-parametern die Schrift und Farbe etc. festgelegt. Alles tiptop ausser dass ich gern den Abstand zum Bild verringern würde. Gibt's da noch was?und wie kriege ich verdammt nochmal die blauen blöden Link-unterline-linien bei den Pfeilen weg?
liebe grüsse
sarah-
Mahlzeit,
Mein nächstes Problem wäre noch die Darstellung.
habe mit einfachen <font>-parametern die Schrift und Farbe etc. festgelegt. Alles tiptop ausser dass ich gern den Abstand zum Bild verringern würde. Gibt's da noch was?Du möchtest sowohl die <img>- als auch die <p>-Tags mit CSS formatieren, du möchtest keine <font>-Tags benutzen. :-)
und wie kriege ich verdammt nochmal die blauen blöden Link-unterline-linien bei den Pfeilen weg?
Auch mit CSS.
MfG,
EKKi-
danke ja, habs unterdessen lösen können.
Weisst du was wegen dem Preload der Gallery? Das wäre flott.
glg
sarah-
Mahlzeit,
Weisst du was wegen dem Preload der Gallery? Das wäre flott.
Wenn ich mich nicht irre, tust du das doch schon?
-----8<-----8<-----8<-----
<script>
var myImages = new Array();
myImages[1] = new Image();
myImages[1].src = "pics/Projekte/1_2_1.jpg";
myImages[2] = new Image();
myImages[2].src = "pics/Projekte/1_2_2.jpg";
myImages[3] = new Image();
myImages[3].src = "pics/Projekte/1_2_3.jpg";
myImages[4] = new Image();
myImages[4].src = "pics/Projekte/1_2_4.jpg";
myImages[5] = new Image();
myImages[5].src = "pics/Projekte/1_2_5.jpg";--->8--->8--->8--->8---
Ich würde allerdings dem <script>-Tag noch eine "type"-Eigenschaft mit dem Inhalt "text/javascript" verpassen und das Vorladen vielleicht innerhalb einer for-Schleife machen (weniger Code, dafür aber flexibler).
MfG,
EKKi-
"...und das Vorladen vielleicht innerhalb einer for-Schleife machen (weniger Code, dafür aber flexibler)."
das musst du mir erklären??!! Das versteh ich nun echt nicht. :(
glg
sarah-
Mahlzeit,
das musst du mir erklären??!!
Muss ich? ;-)
Das versteh ich nun echt nicht. :(
Kein Problem (ohne Anspruch auf Schönheit):
-----8<-----8<-----8<-----
var myImages = new Array();
var anzahl = 5;for (var i = 1; i <= anzahl; i++)
{
myImages[i] = new Image();
myImages[i].src = 'pics/Projekte/1_2_' + i + '.jpg';
}----->8----->8----->8-----
Viel kürzer, viel übersichtlicher und viel flexibler, oder?
MfG,
EKKi
-
-
-
-
-
-
-
-
-
-
Grüße,
verstehe - wurde bloß vom "PHP" in die irre gefhrt - was du brauchst nennt sich AJAX - hängt davon ab in welcher FOrm und wie viele bilder in der Gallery sind - wie speicherst du vor allem die Beschreibung? csv? mySQL? sonstige Form?JS läuft ja clientseitig - beschriebungen sind irgendwo auf demserver.
wenn es viele sind emfehlt sich AJAX, sonst - gibst du die beschribungen einfach mit generirtem HTML aus und speicherst die zB als Strings oder im Array.
für den ersten fall:
http://www.admin-wissen.de/tutorials/eigene-tutorials/webentwicklung/ajax-tutorial/MFG
bleicher--
__________________________-
Menschen an sich , sind nicht schlecht - es sind nur ihre Taten (c).
Lieber bereuen gesündigt zu haben, als nicht sündigen und es später trotzdem bereuen.
Boccaccio
-
-