Fancybox Probleme

CrazyLopp · 29.12.2009

Guten Tag,

Ich bin gerade am frustrieren

Ich bin schon seit tagen dran die Fancybox in meine Html-Datei einzubringen...
Aber ich komm einfach nicht weiter bzw. habe noch nichts geschafft...

Habe mir das schon auf der Hp angeschaut, aber ich versteh nix, habe gerade mal wegen einem guten Tutorial die Lightbox zum laufen gebracht...

Ich will ein Vorschaubild und wenn man da drauf klickt kann man auch die anderen Bilder sehen die man sonst nicht sieht...

Ich hoffe ihr könnt mir helfen

Mfg
Crazylopp

FredFuchs94 · 29.12.2009

AW: Fancybox Probleme

Also ich nutze nur die Lightbox, aber ich habe mir die Fancybox grade angeschaut und denke das die ähnlich anzuwenden sind.
Nun, bei der Lightbox ist es ja so, das wenn du mehrere Bilder zeigen willst du das so machen musst im img(oder war es im a Tag?) Tag: rel="lightbox[gallerie1]"
Du könntest also einfach alle Bilder in das Dokument einfügen und rel="lightbox[gallerie1]" setzen und die dann display:none machen oder sonst wie unsichtbar machen.
Dann machst du einen einzigen Link der eben dein Vorschaubild anzeigt und der dann ebenfalls rel="lightbox[gallerie1]" hat. Hoffe ich labere hier jetzt nicht totalen Humbuk, aber so würde ich das machen.

CrazyLopp · 29.12.2009

AW: Fancybox Probleme

Ja so ist es ungefähr bei der Lightbox, das mit der Lightbox hat ja auch geklappt aber würde gerne die Fancybox verwenden...

Ich weiß nicht was ich beim ersten Bild eingeben muss und dann bei dem Rest

So sieht die Lightbox bei mir aus:

HTML:

<p><a href="fotografie/Herbst2.jpg" rel="lightbox[Krefeld]" title="Ein Hauch Krefeld"><img src="fotografie/Herbst2.jpg" height="200" width="auto" /></a></p>
      <a href="fotografie/Eichenblaetter.jpg" border=0 rel="lightbox[Krefeld]" title="Ein Hauch Krefeld"></a>
      <a href="fotografie/GruenZuRot.jpg" border=0 rel="lightbox[Krefeld]" title="Ein Hauch Krefeld"</a>
      <a href="fotografie/Herbst3.jpg" border=0 rel="lightbox[Krefeld]" title="Ein Hauch Krefeld"</a>
      <a href="fotografie/IMG_0175.jpg" border=0 rel="lightbox[Krefeld]" title="Ein Hauch Krefeld"</a>
      <a href="fotografie/IMG_0152.jpg" border=0 rel="lightbox[Krefeld]" title="Ein Hauch Krefeld"</a>

Mfg
Crazylopp

zutrinken · 29.12.2009

AW: Fancybox Probleme

Musst du nicht dem Absatz-Tag die entsprechende Klasse zuweisen?! ...Hab das bei mir so.
mfG

CrazyLopp · 30.12.2009

AW: Fancybox Probleme

Also ich komm einfach nicht weiter was muss ich verändern bzw. einfügen damit es klappt?

Edit:

Also ich habe sie zum Laufen bekommen, jedoch zerstört die irgendwie mein ganzes Layout...

So sah meine Seite Vorher aus:

Und so nun:

Versteh ich nicht....

sokie · 30.12.2009

AW: Fancybox Probleme

da Änderungen der Darstellung immer auseiner Änderung des Codes resultieren, ist das Posten von Bildern eigentlich sinnfrei.
Es wäre auf der einen Seite gut, wenn es einen Link zur Seite gäbe, auf der anderen gut,wenn du einfach die Tipps aus der Dokumentation und aus deinen vorangegangenen Diskussionen verwenden würdest. bezeichner wie rel="lightbox[begriff]" machen bei der Fancybox nicht sehr viel Sinn.

CrazyLopp · 30.12.2009

AW: Fancybox Probleme

Hier ist der Link

...

Jetzt werden mir irgendwie auch nichtmehr die Bilder angezeigt :hmpf:

Mfg
Crazylopp

Edit:

Ich glaube die beiden Css datein kommen irgendwie nicht miteinander Klar, also die style.css für die Hp und die style.css für die Fancybox...

Mfg
Crazylopp

sokie · 30.12.2009

AW: Fancybox Probleme

Ich glaube die beiden Css datein kommen irgendwie nicht miteinander Klar, also die style.css für die Hp und die style.css für die Fancybox...

diesen Glauben kannst du getrost aufgeben. ALLE formatierungen der fancbox.css beziehen sich auf Selektoren die mit #fancy_... beginnen. Solange Du in deinem eigenen Code keine solchen Bezeichner verwendest KANN es da keinen Konflikt geben.

Jetzt werden mir irgendwie auch nichtmehr die Bilder angezeigt

da musst du mal nachsehen, was mit deinen Bildern ist.Bei den fehlenden Bildern ist auch an der Adresse kein wirkliches Bild zu finden:
zB.
http://crazylopp.bplaced.net/fotografie/Herbst2.jpg

selbst wenn das alle geklärt ist, kann deine Fancybox nur dann funktionieren,wenn du auch die richtigen Bezeichnernamen verwendest. oben verwendest du Klassen :

$("a.zoom1").fancybox({
...
$("a.zoom2").fancybox({

und im Code dann

HTML:

<a class="zoom"

eigentlich klar, dass es da keine Übereinstimmung gibt, das script also keine Elemente zur Darstellung in der Fancybox findet.

CrazyLopp · 30.12.2009

AW: Fancybox Probleme

Die Fancybox selbst geht ja (abgesehen von den Bildern)

Ich Frage mich nur was mit den Layout passiert ist...

Die Pfade kontroliere ich jetzt nochmal...

Mfg
Crazylopp

Edit:

Habe den Fehler vom Layout gerade gefunden, habe ausversehen die style.css von der Test index.html mit verknüpft, klar da die sich da streiten

Mfg
Crazylopp

sokie · 30.12.2009

AW: Fancybox Probleme

wenn dein body die passende hintergrundfarbe hätte,wäre das problem doch auch aus der Welt oder ? (das hat aber mit der fancybox nichts zu tun)

CrazyLopp · 30.12.2009

AW: Fancybox Probleme

Also ich will allen noch mal vielen Dank sagen die mir geholfen haben (ich weiß ich bin nicht gerade der, der alles schnell versteht :rolleyes:

)

Also hier ist das Ergebniss:

Zwar ist noch nicht alles Fertig, aber was die Fancybox angeht schon

Mfg
Crazylopp