wie kann ich ein Foto Album an meiner Hp machen oder rein tuhen???? please
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
action
animation
anzahl
auswahl
beginnen
benutzer
beschriftung
bild
bilderbuch
blttern
button
editor
flash
funktion
galerie
gewehr
pausen
quelltext
skript
zeile
-
Ich will ein Fotoalbum in meine seite reintuhen wie kann ich das machen??
weiss das einer von euch??
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Was genau m?chtest du denn jetzt einbinden?
eine ganz normale galerie, wo man thumbnails anklicken kann und die Bilder dann vergr??ert angezeigt werden?
?dit:
oder soll es etwas ausgefallenes sein, mit so einer art "Umbl?ttern"-animation?!
nein es soll so genau sein wie du zum ersten mal gesagt hast so wenn man das anklickt!
-
Dann host du dir einfach irfran-wiew und der machst das automatisch f?r dich denn so wie ich dih nach deinen Posts einsch?tze bist du ziehmlich faul...
Mit Photoshop w?rde es auch gehen, aber Gewehr haben dann schie?en. -
... aber Gewehr haben dann schie?en.
lol
wenn du zuf?llig doch eine Testversion o.?. von Photoshop hast, da gibt es einen Assistenten....
(Datei-Automatisieren-web-Fotogalerie) f?r die ganz faulen ;)
btw: Geduld schreibt man mit d am Ende
-
Ich habe fotoshop elements geht das auch????
-
!Spamm0r!
Du kannst es entweder per Flash, JS/php oder nur mit HTML(aufwendig) machen.
da ich annehme, dass du kein Flash hast, w?rde ich dir raten es mit JS/php zu machen. Da ich die Codes nicht kenne, solltest du mal rumfragen.
Achja: Es gibt schon so einen Thread, und in den Tuts steht auch was dazu.
per PHP
$bildnum = "5"; /*Anzahl deiner bilder, die bilder m?ssen bild1-bild5 hei?en, die thums(die kleinen) genau so */ while ($bildnum > 1) { echo '<a target="_new" href="/pic/bild"'.$bildnum.'.jpg"><img src="/pic/thumb/bild'.$bildnum.'.jpg" /></a><br>'; }
-AlienDwarf -
also, ein paar worte zur erkl?rung:
Soweit ich dasverstanden habe dienst das php skript das aliedwarf da gepostet hat zum erstellen einer galerie ohne photoshop und ohne irfanview.
dabei musst du bereits die gro?en bilder und die kleinen (thumbnails, kurz thumbs) auf dem server liegen haben und die dinger m?ssen in bestimmmter weise benannt sein. (siehe aliendwarfs post...)
alternativ kannst du mit irfanview oder PS eine Galerie erstellen lassen.
Aliendwarfs Methode hat den Vorteil, dass die Galerie dynamisch ist, d.h., sobald du neue Fotos hochl?dst und entsprechende benennst werden diese vom Skript in die Galerie eingef?gt.
so far...
Gru?
Sven -
zieht nicht!
Wie geht das mit dem umbl?ttern?
Ich will so ein album machen aber da zieht nicht! -
so in etwa:
http://www.grunbach.de/auftritt/cvjm/jungenschaft/bilder/jungenschaft/2004_11_05/bild.php?nr=1
??? -
ja genau so etwas!
-
Kannst du HTML?
Wenn nicht, dann nimm einfach Photoshop Elements und mach damit eine Diashow. Wenn du es mit deinem Uli-Boehm-HTML-Editor machen willst, dann musst du f?r jedes Bild eine eigene Seite machen, die du mit Links verkn?pfst. Ansonsten musst du dir so eine PHP-Seite zum Beispiel aus dem Beitrag oben schicken lassen und sie anpassen. -
Das ist der Code, den ich verwende:
<?php $anz = '6'; // Anzahl der Bilder $path ="bilder/"; //Ordner in dem die Bilder sind $nr = $_GET['nr']; ?> <!-- Code by http://www.t-b.de.tc --> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Bild Nr. <?php echo ($nr);?></title> </head> <body> <p><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><div align="center">Titel</div></td> </tr> </table> </p> <p align="center"><img src="<?php echo ($path.$nr);?>_JPG.jpg"></p> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><div align="left"><a href="<?php echo($_SERVER['PHP_SELF']."?nr="); if ($nr == 01){ echo ($anz); }else{echo ($nr-1);} ?>">vorheriges Bild</a> </div></td> <td><div align="right"><a href="<?php echo($_SERVER['PHP_SELF']."?nr="); if ($nr == $anz){ echo ('1'); }else{echo ($nr+1);} ?>">nächstes Bild</a></div></td> </tr> </table> </body> </html>
Beitrag zuletzt geändert: 19.10.2010 13:34:52 von tct -
Mit diesem Script kann wie in einem Bilderbuch zwischen Bildern vor und zur?ck gebl?ttert werden, ohne die gesamte Seite neu laden zu m?ssen.
<html>
<head>
<title>"Bilderbuch"</title>
<script language="JavaScript">
<!--
/*Bilderbuch: Script zum Bl?ttern zwischen verschiedenen Bildern
Copyright: world-of-scripts.net
http://www.world-of-scripts.net*/
var Bild = new Array();
Bild[0] = new Image(); Bild[0].src="images/bild1.jpg";
Bild[1] = new Image(); Bild[1].src="iamges/bild2.jpg";
Bild[2] = new Image(); Bild[2].src="images/bild3.jpg";
Bild[3] = new Image(); Bild[3].src="images/bild4.jpg";
Bild[4] = new Image(); Bild[4].src="images/bild5.jpg";
nr = 0;
function Blaettern(Richtung)
{
if (Richtung == -1)
{
nr = nr-1;
if (nr == -1)
{
nr = Bild.length-1;
}
}
else
{
nr = nr+1;
if (nr == Bild.length)
{
nr = 0;
}
}
zeigeBilder();
}
function zeigeBilder()
{
document.images.pictures.src=Bild[nr].src;
}
//-->
</script>
</head>
<body>
<div align="center">
[<a href="javascript:Blaettern(-1)"><<</a>|
<a href="javascript:Blaettern(1)">>></a>]<br>
</div>
<div align="center"><img src="images/bild1.jpg" name="pictures"></div>
</body>
</html>
Erkl?rung
Zuerst werden die URLs zu den verschiedenen Bildern definiert (Bild[0] = ... Bild[0].src = ...).
Dann wird die Funktion Blaettern() definiert. Diese bl?ttert je nach Auswahl des Benutzers 1 Bild weiter oder zur?ck.
Durchif (Richtung == -1) wird gepr?ft, ob der Benutzer zur?ck (-1) oder vorw?rts (1 bzw. sonst=else) bl?ttern will. Je nach Auswahl (durch if-Schleife abgefragt) wird das n?chste (nr = nr+1;) oder vorherige (nr = nr-1;) Bild geladen.
Damit das Script wei?, welches Bild es ersetzen soll, muss dem Bild im img-tag ein Name gegeben werden (<img src="..." name="pictures">).
_______________________________________
_______________________________________
Dieses Script ist eine Abwandlung des "Bilderbuches". Hier wird automatisch gebl?ttert.
<html>
<head>
<title>world-of-scripts.net [Anwendungsbeispiel Diashow]</title>
<script language="JavaScript">
<!--
/*Bilderbuch: Script zum Bl?ttern zwischen verschiedenen Bildern
Copyright: world-of-scripts.net
http://www.world-of-scripts.net*/
var Bild = new Array();
Bild[0] = new Image(); Bild[0].src="images/nordlicht.jpg";
Bild[1] = new Image(); Bild[1].src="images/osten.jpg";
Bild[2] = new Image(); Bild[2].src="images/palmen.jpg";
Bild[3] = new Image(); Bild[3].src="images/vulkan.jpg";
Bild[4] = new Image(); Bild[4].src="images/sonnenuntergang.jpg";
dauer=4000;
nr = 0;
aktiv=setTimeout("Blaettern()",dauer);
function Blaettern()
{
nr = nr+1;
if (nr == Bild.length)
{
nr = 0;
}
document.images.pictures.src=Bild[nr].src;
aktiv=setTimeout("Blaettern()",dauer);
}
function Blaetter(Richtung)
{
if (Richtung == -1)
{
nr = nr-1;
if (nr == -1)
{
nr = 2;
}
}
else if (Richtung == 1)
{
nr = nr+1;
if (nr == Bild.length)
{
nr = 0;
}
}
Pause();
document.images.pictures.src=Bild[nr].src;
}
function Pause()
{
window.clearTimeout(aktiv);
document.form1.Pause.value="Weiter";
document.form1.action="javascript:Weiter();";
document.form2.Pause.value="Weiter";
document.form2.action="javascript:Weiter();";
}
function Weiter()
{
aktiv=setTimeout("Blaettern()",dauer);
document.form1.Pause.value="Pause";
document.form1.action="javascript:Pause();";
document.form2.Pause.value="Pause";
document.form2.action="javascript:Pause();";
}
function Blaetter_N(Richtung)
{
if (Richtung == -1)
{
nr = nr-1;
if (nr == -1)
{
nr = 2;
}
}
else if (Richtung == 1)
{
nr = nr+1;
if (nr == Bild.length)
{
nr = 0;
}
}
Pause_N();
document.images.pictures.src=Bild[nr].src;
}
function Pause_N()
{
window.clearTimeout(aktiv);
}
function Weiter_N()
{
aktiv=setTimeout("Blaettern()",dauer);
}
//-->
//-->
</script>
</head>
<body>
<!--Beginn Netscape-Weiche-->
<script language="JavaScript">
name = navigator.appName;
version = navigator.appVersion.substring(0,1);
if(name+version == "Netscape3")
{
document.write('<div align="center">
[<a href="javascript:Blaetter_N(-1);"><<</a> |
<a href="javascript:Pause_N();">Pause</a> |
<a href="javascript:Weiter_N();">Weiter</a> |
<a href="javascript:Blaetter_N(1);">>></a>]<br>
</div>');
}
else
{
document.write('<div align="center">
<form name="form1" action="javascript:Pause();" method="get">
[<a href="javascript:Blaetter(-1);"><<</a> |
<input type="Submit" name="Pause" value="Pause"> |
<a href="javascript:Blaetter(1);">>></a>]<br>
</form></div>');
}
</script>
<!--Ende Netscape-Weiche-->
<div align="center"><img src="images/nordlicht.jpg" name="pictures"></div>
<!--Beginn Netscape-Weiche-->
<script language="JavaScript">
name = navigator.appName;
version = navigator.appVersion.substring(0,1);
if(name+version == "Netscape3")
{
document.write('<div align="center">
[<a href="javascript:Blaetter_N(-1);"><<</a> |
<a href="javascript:Pause_N();">Pause</a> |
<a href="javascript:Weiter_N();">Weiter</a> |
<a href="javascript:Blaetter_N(1);">>></a>]<br>
</div>');
}
else
{
document.write('<div align="center">
<form name="form2" action="javascript:Pause();" method="get">
[<a href="javascript:Blaetter(-1);"><<</a> |
<input type="Submit" name="Pause" value="Pause"> |
<a href="javascript:Blaetter(1);">>></a>]<br>
</form></div>');
}
</script>
<!--Ende Netscape-Weiche-->
</body>
</html>
Erkl?rung
Zuerst werden die URLs zu den verschiedenen Bildern definiert (Bild[0] = ... Bild[0].src = ...).
Mit dauer=4000 wird die Anzeigedauer eines Bildes in Millisekunden festgelegt.
Dann wird die Funktion Blaettern() definiert. Diese bl?ttert immer 1 Bild vor (nr = nr+1;).
Wenn das Ende der Liste (if (nr == Bild.length)) erreicht wird, wird wieder von vorne begonnen (nr = 0;).
Damit das Script wei?, welches Bild es ersetzen soll, muss dem Bild im img-tag ein Name gegeben werden (<img src="..." name="pictures">).
Durch setTimeout("Blaettern()",dauer); wird festgelegt, nach wie viel Millisekunden gebl?ttert werden soll ( d.h. die Funktion Blaettern() ausgef?hrt werden soll).
Damit das Script etwas komfortabler ist, wird nun noch ein Navigations-Panel zum Bl?ttern und anhalten der Diashow erstellt. Hierzu wird noch eine Funktion Blaetter(Richtung) (ungleich Blaettern) definiert. Diese kennen wir bereits aus dem Bilderbuch.
Zus?tzlich werden noch die Funktionen Pause() und Weiter() definiert. Diese halten durch window.clearTimeout(aktiv); die Diashow an und starten sie wieder durch aktiv=setTimeout("Blaettern()",dauer);. Nun werden noch die Beschriftung und die action des Buttons ge?ndert (document.form1.Pause.value="Weiter"; document.form1.action="javascript:Weiter();"; ...).
Alle Funktionen deren Bezeichnung mit _N endet, sind f?r Netscape 3 gedacht. Dieser kann n?mlich in der Version 3 nicht die Beschriftung eines Buttons ?ndern etc.
Daher wurde eine extra Netscape-Weiche erstellt, in der "Weiter" und "Pause" nicht aus 1 dynamischen Button, sondern aus 2 Textlinks besteht.
ACHTUNG! Alle Zeilen, in denen durch document.write('...') QUELLTEXT ausgegeben wird, m?ssen in 1 (einer) Zeile stehen!
Bitte DIESEN Quelltext mit Strg+A und Strg+C kopieren und im Editor wieder einf?gen, da beim oberen aus Platzgr?nden die document.write('...')-Zeilen NICHT in 1 Zeile stehen.
-
so und das geh?rt aber nach html oder?
Edit jacr
Ja, das geh?rt nach html.
P.S. Ich habe hier einige Spambeitr?ge entfernt.
Sollte jemand nicht wissen was Spam ist bitte die FAQ lesen. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
