Webstatt.org - Community seit 2006 - 2012 (2024?)

Galleria

user-222
14.05.2008 14:28

Sry, ich hab von Javascript echt 0 Ahnung.. würde aber gerne diese Bildergallerie verwenden.
Ich hab in einem Ordner zu Testzwecken 2 Fotos (1.jpg und 2.jpg) auch die galleria.css und jquery.galleria.js datei ist in dem Ordner.
Mein html-Code in der index.html sieht so aus:

<!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>Unbenanntes Dokument</title>
<link href="galleria.css" rel="stylesheet" type="text/css" media="screen">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.galleria.js"></script>
<script type="text/javascript">
jQuery(function($) { $('ul.gallery'zwinkern.galleria(); });
</script>
</head>

<body>

<ul class="gallery">
<li><img src="1.jpg" title="A caption" alt="Image01"></li>
<li><img src="2.jpg" title="B caption" alt="Image02"></li>
</ul>



</div>
</body>
</html>


allerdings funktioniert das nicht traurig ich sehe nur die 2 bilder in einer liste..
Woran liegt das?


DANKE!
lg

Avatar user-349
14.05.2008 16:49

Hast du das Beispiel wo online?

Avatar user-271
14.05.2008 17:22

noja...du brauchst jquery.js.....und das andere zeug...ohne demo kann man es nich sehen

hab grad das ganze mal getestet....es funktioniert einwandfrei:
http://demo.moonsword.info/Galleria/galleria.html

grad mal rumprobiert...deine jquery oder deine jquery.galleria wird nicht gscheit geladen zwinkern
funktioniert nämlich sonst einwandfrei:
http://demo.moonsword.info/Galleria/galleria2.html

#!/bin/bash
traurig){ neutral:& };:
user-222
14.05.2008 21:07

oh ja danke!!!
aber hab noch ne frage und zwar würd ich die gallery gerne so haben das ich, sobald ich sie öffne das erste bild bereits angezeigt wird. und nur das aktuelle bild soll im thumbnail mit 100% deckkraft erscheinen.(die anderen so 50%.) und wichtig wäre noch so eine Überblendung wie in dem Beispiel.

DANKE!
lg

Avatar user-271
14.05.2008 21:34

kopier dir einfach das beispiel, den Javascript source und schon haste es ^^
damit das erste angezeigt wird einfach ein: <li class="active">
und schon ist das active zwinkern
darf natürlich nirgends anders ein class="active" sein

#!/bin/bash
traurig){ neutral:& };:
user-222
15.05.2008 15:16

Danke! also es läuft jz alles aaaber ich habs jez in die eigentliche seite eingefügt und es verträgt sich nicht so wirklich traurig

Galleria_test

Avatar user-162
15.05.2008 15:37

Inwiefern verträgt es sich nicht? Also ich kriege keinen Javascript-Fehler..?

Perfection is not when there’s nothing to add, but when there’s nothing to take away swisscheek.com/magazine
user-222
15.05.2008 15:39

naja die site sollte eig so aussehen..

Avatar user-162
15.05.2008 15:51

der Fehler dafür liegt aber nicht beim JS sondern hier:

* {
background:#FFFFFF none repeat scroll 0% 50%;
margin:0pt;
padding:0pt;
}

dadurch dass du jedem ( * ) Element einen weissen Hintergrund verpasst, werden die die Anker <a /> in deiner Navigation auch weiss. Entweder das rausnehmen oder bei den Anker explizit einen schwarzen Hintergrund definieren.

Und die Überschrift ist so zentriert, weil sie das vom <body /> geerbt hat (text-align:center) was übrigens ziemlich schwachsinnig ist, was willst du damit bezwecken? Auch hier center beim <body /> raus (was ich stark empfehle!) oder text-align beim <h5 /> auf left.

Wenn wir schon bei der Überschrift sind:

<div>
<a>
<h5>bla</h5>
</a>
</div>

Das ist auch sehr unschön bzw sogar sehr falsch, weil der Anker <a /> als Inlineelement muss innerhalb des Blockelementes <h5 /> sein. Ausserdem ist das <div /> unnötig.
Also besser so:

<h5><a>bla</a></h5>

Perfection is not when there’s nothing to add, but when there’s nothing to take away swisscheek.com/magazine