Hallo,

meine Fancybox funktioniert fast, es hakt nur an einer kleinen Stelle und da meine Programmierkenntnisse noch sehr jungfräulich sind muss ich euch um Rat bitten.

Hier mein Problem:

Wenn ich meinen Bild-Link irgendwo in den 'Body' tue funktioniert Alles einwandfrei.
Wenn ich meinen Bild-Link allerdings in einen meiner DIV's tue sieht man zwar das Bild man kann aber weder darauf klicken noch passiert irgendwas...

Hier mein Beispiel:


So sollte es funktionieren, tut es aber nicht:

HTML-Code:

<div id="about">
    <ul>
        <li>
            <a href="#about" name="about1">	
            <a id="single_image" href="Bild.jpg"><img src="Bild_klein.jpg" alt="Bild"/></a>
    </ul>
</div>
</p>
</div>

Wenn ich diesen Part einfach in den Body tue funktioniert es:

HTML-Code:

<a id="single_image" href="Bild.jpg"><img src="Bild_klein.jpg" alt="Bild"/></a>

Was mache ich also falsch?
Muss ich irgendwelche inline angaben machen?

Wäre Euch sehr dankbar für eure Hilfe!

Danke!

Falsch

HTML-Code:

<div id="about">
<ul>
<li><a  href="#about" name="about1"> 
<a id="single_image" href="Bild.jpg"><img src="Bild_klein.jpg" alt="Bild"/></a>

</ul></div>
</p>
</div>

Richtig

<div id="about">
<ul>
<li><a href="#about" name="about1">Über mich</a></li> <- Wozu dieser Anker ********
<li><a id="single_image" href="Bild.jpg"><img src="Bild_klein.jpg" alt="Bild"/></a></li>
</ul>
</div>
</div>

Besser ist ein Testcase Und Bilder die zum Layouten verwendet werden, haben im HTML Markup nichts zu suchen. Dafür gibt es CSS.

Kannst ja mal hier Gucken
http://www.gipspferd.de/css/anleitung/a16/a16.php

Danke für die Hilfe.
Leider blicke ich immer noch nicht ganz durch.

Ich kopier hier noch mal meine Codes rein:

Im CSS-Stylesheet bzw. im Head:

Code css:

1 2 3 4 5 6 7

#about { text-align: center; vertical-align: middle; position: absolute; top: 4000px; left: 4000px; width: 100%; height: 100%; margin-top: 3%; margin-left: 100%; border: dotted 1px #c0c0c0; }       #about ul     { text-align: center; vertical-align: middle; position: absolute; top: 50%; left: 50%; width: 10px; height: 10px; margin-top: -200px; margin-left: -200px; list-style-type: none; }         #about li     { text-align: center; vertical-align: middle; top: 50%; left: 50%; width: 400px; height: 400px; margin-top: -40px; margin-left: -40px; display: inline; padding: 0; }

Im Body:

HTML-Code:

<div id="about">
			<ul>
				<li><a href="#about" name="about1">ABOUT</a>
					
			</ul></div>
				</p>
		</div>

Und an die Stelle wo jetzt noch "ABOUT" steht soll einfach das Bild welches man dann anklicken kann und dann in der fancybox geöffnet wird.

Wenn ich meinen Fancybox-Code für mein Bild nun an die Stelle kopiere wo jetzt noch "ABOUT" (ich habe das so gemacht:

HTML-Code:

<div id="about">
			<ul>
				<li><a href="#about" name="about1"><a id="single_image" href="DemoCover_neu_03.jpg"><img src="DemoCover_neu_03.jpg" alt="Bild"/></a></a>
					
			</ul></div>
				</p>
		</div>    )

steht sieht man zwar das Bild man kann es aber nicht anklicken.

Ich hoffe Ihr versteht was ich meine und machen will.

Hi

da ihr beide noch ziemlich neu hier seit:
Verwendet bitte die Codetags (Link in meiner Signatur).

Das hilft nicht nur den Stammusern, sondern euch sicher auch.

Entschuldigt, ich habe den Fehler gefunden!
Der Z-Index war nicht hoch genug... deshalb konnte man das Bild nicht anklicken.
Nun habe ich den Z-Index erhöht und siehe da, es funktioniert.

Danke für die Hilfe!

Viele Grüße!

...und markier das Thema das nächste Mal als erledigt.