Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag12.02.2010 um 22:41 (UTC)    
Titel: Iceblue: CSS-Galerie Code problem mit Content

Abend

Ich wollte diesen Galerie Code benutzen, und es geht soweit auch alles, nur wenn ich auf das verkleinerte Bild gehe, kommt das große, in der richtigen größe.. soweit so gut.. nur ist auf meiner Seite das Bild größer als das Feld vom Contentbereich...

Hier die Seite wo man es bei uns sieht:
http://www.soft-air-rangers.de/test.htm

Hier der Code:
Code:
<style type="text/css">

.gallerycontainer{
position: relative;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 0px solid black;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 0px solid black;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 0px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 0;
left: 0px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

</style>

<div class="gallerycontainer">
<a class="thumbnail" href="#thumb"><img src="http://img.webme.com/pic/s/soft-air-rangers/archangel_profil.jpg" width="200px" height="170px" border="0" /><span><img src="http://img.webme.com/pic/s/soft-air-rangers/archangel_profil" /><br /></span></a>
</div>


Meine Frage ist nun:

Kann ich das vergrößerte Bild, das angezeigt wird, über mein content feld anzeigen lassen?
Und ich weiß auch das ich den Content verbreitern kann, aber ich muss mit dem code später dann 4 bilder nebeneinander anzeigen lassen.. schlecht wenn dann der content 3000x3000px beträgt Wink

Hoffe auf eure MIthilfe.
Gruß
ArchAngel
______________
Bored to infinity and beyond...
Beitrag12.02.2010 um 23:00 (UTC)    
Titel:

Hallo,

erstens fehlt dir was in deinem code:

Zitat:
<div class="gallerycontainer">
<a class="thumbnail" href="#thumb"><img src="http://img.webme.com/pic/s/soft-air-rangers/archangel_profil.jpg" width="200px" height="170px" border="0" /><span><img src="http://img.webme.com/pic/s/soft-air-rangers/archangel_profil.jpg" /><br /></span></a>
</div>


Das Rote musst du noch hinzufügen.

Ja, das Bild ist zu groß! AChte beim Hochladen des Originalbildes, dass es nicht breiter ist als dein Content. Dann sollte es passen.

Aber ein Tipp: Warum nutzt du nicht eine Thickbox, um deine Bilder anzuzeigen!

So gehts:

An oberste Stelle vom Quellcode fügste diesen Code ein:

Zitat:
<script type="text/javascript" src="http://img.webme.com/designs/globals/jquery.js"></script>
<script type="text/javascript" src="http://img.webme.com/designs/globals/thickbox.js"></script>
<link rel="stylesheet" href="http://img.webme.com/designs/globals/thickbox.css" type="text/css" media="screen" />


Damit die Bilder dargestellt werden können, wird noch ein Link sowie ein Bild
verwendet.

Zitat:
<a href="bildadresse.jpg" class="thickbox"><img width="150" src="bildadresse.jpg" border="0" /></a>


Du musst 2x die selbe Bildadresse angeben. Beim blauen
wird das Bild über diese Thickbox geöffnet. Dabei wird die Orginalgröße verwendet.

Beim roten wird dann die Bildvorschau benutzt, das Bild wird die Größe erhalten,
die beim grünen angeben wird.

Wenn das Bild klein ist und dann beim grünen ein Wert verwendet wird,
wodurch das Vorschaubbild nicht verkleinert wird - dann ensteht auch keine
großartige Änderung.

Hinweis: Bei Bildern die via Thickbox benutzt werden sollen, sollten in der
Standardgröße verwenden werden - beim Hochladen den Haken "Bild verkleinern" entfernen!

Wenn es fertig ist, könnte es so aussehen:

Arrow http://www.harley-motorcycles.de/Ride-in-peace.htm
______________
Mit besten Grüßen Marco
www.harley-motorcycles.de

Beitrag12.02.2010 um 23:14 (UTC)    
Titel:

Vielen dank erstmal für die schnelle Rückmeldung!

So, die Thickbox ist drin.. und sie funktioniert.

Aber 2 Fragen habe ich noch Smile

1.)Wenn ich auf das verkleinerte Vorschau Bild klicke, erscheint nicht das Bild mit der upgeloadeten Größe von 500px × 708px , sondern das Bild wurde skaliert zu 382px × 541px ...

Was läuft da schief? Hängt das wieder mit der contentbreite zusammen oder so?

2.) Wenn ich beim code die border zahl erhöhe, scheint das keine auswirkungen zu haben..
Muss ich noch extra dazu etwas hinschreiben?

Danke nochmals
______________
Bored to infinity and beyond...
Beitrag12.02.2010 um 23:40 (UTC)    
Titel:

Na schön dass es klappt. Sieht auch gut aus!

Zitat:
Wenn ich auf das verkleinerte Vorschau Bild klicke, erscheint nicht das Bild mit der upgeloadeten Größe von 500px × 708px , sondern das Bild wurde skaliert zu 382px × 541px ...


Bei mir zeigt es das Bild in der Größe 500px x 708 px an!

Border erkenne ich bei dir auch nicht! Mal probiert, border-color: #XXXXXX hinzufügen?
______________
Mit besten Grüßen Marco
www.harley-motorcycles.de

Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de