Antworten zum Thema „Code für Bildergallerie“

NiklasD · 05.11.2006

Hallo liebe PSD-Tutorials.de user.

Mir fehlt für meine neue Homepage eine ausgefallene Bildergallerie. Allerdings bin ich kein Programmierer sondern eher ein Anfänger im Designen.
Deshalb wollte ich mich an die doch schon berühmten PSD-Tutorials-User wenden, die doch immer gerne helfen

.

Kann mir bitte wer einen Code für eine Bildergallerie erstellen?

Bitte keine antworten wie : schau bei google.de oder benutz die *Such-Funktion*

Danke schön!.

Gruss: NiklasD

*Die Such-Funktion habe ich schon benutzt...*

Crumbler · 05.11.2006

hi!
guck mal hier, da solltest du finden was du suchst:

NiklasD · 05.11.2006

aber genau das was ich brauchte perfekt!

Dickes dankeschön, und euer Ruf liegt also nicht falsch!

HF Gruss : NiklasD

mondbine · 05.11.2006

hm, leider stehen bei denen die ich so toll finde, keine html codes bei. hat die jemand zufällig oder kann man sie anderswo einsehen?

liebe grüße,
bine

nerak · 06.11.2006

But where's the code?
I have had many emails asking where the code/style can be found for the various demonstrations.

Well the xhtml is always placed in the #info div, so examine the source code, find the <div id="info">.....</div> and in between is the 'code'.

In most case the style is embeded in the page <head>...</head>. This is done to keep it all together on the same page making it easier to find. In some cases the css is held in a separate file (where it should be) and is loaded in the normal way <link rel="stylesheet" media="all" type="text/css" href="path to css file.css" /> so just add this path to the address in your browser to see the css file.

... also wenn ich das mit meinem grottenschlechten Englischkenntnissen anschau würd ich sagen: mit rechter Maustaste draufklickern - Quellcode anzeigen auswählen - da drin dann <div id="info">.....</div> suchen und wenn nicht vorhanden den Pfad <link rel="stylesheet" media="all" type="text/css" href="path to css file.css" /> suchen und dort die separate css-Datei laden ...

NiklasD · 06.11.2006

also, mit meinem noch schlechteren English^^würde ich sagen du hast recht!.

Aber ich habe auch den Code da nicht genommen. Sondern nur die Kreativen ideen. Da ich wenn überhaupt eigentlich in HTML bleiben wollte. Habe ich einfach die Kreativen ideen genommen und mir mit ImageReady und dem schönen Slicetool eine eigene Gallery erstellt... Das einzige Problem ist nur....

.............................................................. Ladezeit.................................................

Hat nicht irgendwer ein Code oder eine Seite wo eine einfache Gallery ist?
Am besten in HTML XHTML oder PHP würden auch gehen.

Am optimalsten wäre eine Gallery, wo du einmal groß das ein Bild in der mitte hast. Unter dem siehst du die anderen Bilder, aber alle in klein. Bei einem Klick wird das nächste Bild groß u.s.w.

Wäre echt nett damit diese
.............................................................. Ladezeit.................................................

zu so einer

...Ladezeit...

werden kann :razz:

Vielen-Dank

Gruss Niklas :idea:

mammimonstA · 06.11.2006

NiklasD schrieb:
Aber ich habe auch den Code da nicht genommen. Sondern nur die Kreativen ideen. Da ich wenn überhaupt eigentlich in HTML bleiben wollte.

:?:
Was bitte, ist deiner Meinung nach, denn CSSPlay? Flash? oÔ
Und wenn du meinst, du willst kein CSS verwenden, dann entschuldige mich, ich liege dann in der Ecke und schrotte mein Zwerchfell ( !-)))) ).

Ich würde mich über eine normale Antwort freuen, dann erkläre ich dir auch, warum mein Zwerchfell so belastet wurde.

LG,
Kevin

kleinerVampir · 06.11.2006

ist ganz einfach

die absolute Anfänger Methode

- bastel dir eine Tabelle mit meinetwegen 9 Zellen

Code:

<table border="0" bordercolor="#FF0000" width="100%" bgcolor="#FFFFFF">
<tr>
<td></td>
<td>[img]bild2.jpg[/img] </td>
<td>[img]bild3.jpg[/img]</td>
</tr>
<tr>
<td>[img]bild4.jpg[/img]</td>
<td>[img]bild-mitte.jpg[/img]</td>
<td>[img]bild5.jpg[/img]</td>
</tr>
<tr>
<td>[img]bild6.jpg[/img]</td>
<td>[img]bild7.jpg[/img]</td>
<td>[img]bild8.jpg[/img]</td>
</tr>
</table>

Das ganze verschönerst du mit hover bzw. onClick Effekten und lässt das angeklickte Bild dann in der Mitte groß anzeigen.

Soweit klar oder soll ich dir den Code dafür eben zeigen ?

LG kleinerVampir

NiklasD · 06.11.2006

Nun ja wenn du meine "Vorstellung" gelesen hättest dann wüstest du das meine Kenntnise in Programmieren nicht die besten sind. Und ich will meine Homepage lieber auf HTML basiernd lassen damit ich selbst noch durchsteige und es verbessern kann. Aber statt dich sinnlos einen in die Faust zu lachen könntest du mir ja weiterhelfen statt auszulachen?! ?!
Oder bin ich hier etwa im falschem Forum?
Darf man hier keine anfänger Fehler bzw anfänger Fragen stellen?
Wenn nicht dann sorry! Wenn doch dann bitte um aufklärung!

edit : Oh KleinerVampier warste schneller als ich, vielen dank!!!!
Und ich bin gerade beim Praktikum. Muss das später ausprobieren und gucken ob ich noch einmal deine Hilfe brauche. Wenn ja dann Poste ich es hier einfach rein. Danke noch mal!

mammimonstA · 06.11.2006

Ich hab dir gesagt, du sollst nur bescheid sagen, ob du es Ernst gemeint hast und ich helfe dir.
CSS ist für gute Webarbeit unabdinglich und mit Javascript versaust du dir nur die Seite. In HTML gibt es garnicht wirklich Möglichkieten um irgendwas zu machen. Das geht nur mit CSS & JS.
Und über JS hab ich ja schon was gesagt. Ich empfehle dir nur dringenst CSS zu lernen, ansonsten mach eben dein zeug und merke erst hinterher, dass es Quatsch war.
Ich helfe euch, ich mekrt es nur nicht.
Naja, veilleicht sollte ich auch etwas weniger schnippisch schreiben... Aber so bin ich nunmal ^^ Also nimms nich so verkniffen

kleinerVampir · 06.11.2006

so schlecht wie JavaScript hier immer hingestellt wird ist es garnicht. Denn sonst würden wohl kaum große Provider wie freenet.de oder web.de (um nur zwei zu nennen) auf ihren Seiten JavaScript einsetzen. Wenn man bedenkt das die JavaScript Technologie um einiges älter ist wie CSS und dennoch überall großen Anklang findet, trotz dass CSS "so gut" ist, ist es doch fraglich, warum selbst IT Profis immer wieder auf diese Technologie zurück greifen. Aber wir schweifen vom Thema ab. Ich würde sagen jedem das seine. Und zu der Aussage "was ist wenn ich Javascript abgeschaltet habe" fällt mir nur eins ein: Was ist mit den Fehlern die CSS bezüglich der Anzeige bei unterschiedlichen Browsern produziert ? Nimm alleine den :hover Effekt und dann Firefox bzw. IE usw. Außerdem dürften User dann bei ca. 40% aller Internetseiten Probleme haben / bekommen wenn Javascript deaktiviert ist. Ich würde diese Art der Bildergalerie mittels JavaScript aufbauen.

mammimonstA · 06.11.2006

Diese Fehler produziert nicht das CSS, sondern der Browser... :oops:

Sog. IT-Profis sind im übrigen in mehr als 50% der Fälle einfach nur Stümper...

mondbine · 06.11.2006

jetzt mal eben bitte langsam zum mitschreiben, für nicht ganz so sichere leute im umgang mit css und js.
oben kam etwas wegen der ladezeit. war das jetzt auf die bildergallerien von dem obigen link bezogen oder wozu?
denn für meine hp würde ich sehr gerne eine dieser gallerien nehmen, jedoch nur wnen die ladezeit nicht so unendlich ist (was natürlich auch stark von den bildern abhängt).

liebe grüße,
bine

kleinerVampir · 06.11.2006

zum mitschreiben:

die Ladezeiten sind abhängig davon wie groß deine Bilder sind.
kommen wir zu dem ach so schlechten Javascript womit nur die Stümper arbeiten (laut Aussage von mammimonstA) !-)))) mit Javascript kannst du dir einen Preloader erstellen, der es ermöglicht die Bilder vorzuladen. Das heißt die Bilder werden vorab geladen, was ziemlich Benutzerfreundlich ist. Es gibt bei Javascript sogenannte onMouseOver OnClick Events welche man perfekt für Bildergalerien nuten kann um damit diverse Ereignisse wie z.B. einen Bildwechsel bei drüberfahren bzw. anklicken mit der Maus zu erzeugen.

mammimonstA · 06.11.2006

Ich meinte ja nicht, dass die Leute nix können. Ich habe größten Respekt vor den Programmierern dieser AJAX-Anwendungen. Aber das ist kein Webstandart und deswegen nicht die zünftige Art. Man sollte sich doch im Webbereich an gewisse Konfessionen halten, sonst wird es noch schlimmer. Wieviele der Milliarden Webseiten sind sinnlos? Wieviele schlampig gecodet? Wieviele ohne irgendnen header außer nem title? Wieviele stecken in nem großen Frame drin, damit ja die Domain in der Adressenleiste drinsteht? Wieviele geben damit Suchmaschinen keine Möglichkeit, sie zu indizieren und ihre (wenn vorhandenen) Informationen zu verwalten?

Wer soll nutzen von dem Informationbrocken haben, wenn er schluderig im Elementarsten ist?

Das ist es was ich meine. Leider wird es als Arroganz oder was auch immer missverstanden. Den Preloader kann man sich sparen. display:none; tuts auch. Aber wir können es ja sowieso nicht ändern...

DocUhu · 06.11.2006

mammimonstA schrieb:
...
Wieviele ohne irgendnen header außer nem title?
...

Wenn ja wenigstens das klappen würde:

mondbine · 06.11.2006

so habe mich nun mal an einer der gallerien getraut (ist für mich relatives neuland).
ist auch soweit alles nach meinen vorstellung bis auf eine sache.
in der galerie befinden sich 9 bilder, 8 senkrechte 1 waagerechtes. die galerie ist jetzt aber auf senkrechte bilder ausgerichtet, kann man da was deichseln, das wenn man auf das waagerechte klickt, die tabelle sozusagen"mitgeht" und sich anpasst?
hoffe mich hat wer verstanden

liebe grüße,
bine

kleinerVampir · 06.11.2006

du könntest bei #container_left width: einfach auf 700px setzen dann passt das Bild auch. ist die einfachste und schnellste lösung

mondbine · 07.11.2006

huhu,
dankeschön.
aber welchen #container_left width meinst du denn? gibt ja mehrere

liebe grüße,
bine

kleinerVampir · 07.11.2006

Code:

/* styling for LEFT gallery */
#container_left {position:relative; width:600px; height:545px; background:#d1c8c3; border:1px solid #a49188; margin:1em auto;}

diesen