|
|||
Realtive Bildhöhe und -breite einer jQuery Slideshow
Hallo Leute,
ich bräuchte mal bitte eure Hilfe, da ich absolut keine Idee mehr habe, wie ich mein Problem lösen kann. Ich habe eine jQuery-Slideshow mit zur Zeit festen Bildgrößen. Ich möchte jedoch die Größe der Bilder in Prozentwerten angeben, jedoch fliegt mir dann das komplette Layout um die Ohren. Übersicht halber habe ich mein Problem auf folgende Zeilen gekürzt: HTML-Code:
<html> <head> <script src="lib/jquery-1.9.1.min.js" type="text/javascript"></script> <script src="lib/jquery-ui-1.10.2.min.js" type="text/javascript"></script> <style> #slideshow { background: red; position: relative; width: 300px; } .slide { position: absolute; top:0;left:0;right:0;bottom:0; } .slide img { float: left; width: 100px; height: 100px; } .clear { clear: both; } </style> <script> $(document).ready(function() { $('#slideshow').height($('img').outerHeight()); $("#slideshow > div:gt(0)").hide(); setInterval(function() { $('#slideshow > div:first') .fadeOut(3000) .next() .fadeIn(3000) .end() .appendTo('#slideShow'); }, 5000); }); </script> </head> <body> <div id="slideshow"> <div class="slide"> <img src=""> <h2>Slide 1</h2> <p>Beschreibung</p> <div class="clear"></div> </div> <div class="slide"> <img src=""> <h2>Slide 2</h2> <p>Beschreibung</p> <div class="clear"></div> </div> </div> </body> </html> Code:
.slide img { float: left; width: 10%; height: 10%; } Viele Grüße Riedi |
Sponsored Links |
|
|||
Deinem Dokument fehlt ein Doctype, z.B.
HTML-Code:
<!DOCTYPE html>
__________________
Über Internet Explorer 8: Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt. Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt. Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt. Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard. |
Sponsored Links |
|
||||
Zitat:
Baue die Testseite besser selber zusammen und zeige den Link dazu. Lesetipp: http://xhtmlforum.de/40080-f-r-frage...twortende.html
__________________
MfG Jens Geändert von plastiko (26.03.2013 um 01:05 Uhr) |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Wie jQuery Slideshow mehrfach einfügen? | MythTakes | Javascript & Ajax | 5 | 04.05.2012 18:29 |
Ladezeitenstatus-Bild bei JQuery Slideshow möglich? | MarkusStar | Javascript & Ajax | 2 | 19.04.2010 22:44 |
jquery slideshow | uwehamburg | Javascript & Ajax | 3 | 28.05.2009 13:37 |
3 Spalten | Aussen: variable Breite; Mitte: feste Breite | dreamshocker | CSS | 9 | 17.08.2005 17:23 |