1Danke
ERLEDIGT
JA
JA
ANTWORTEN
4
4
ZUGRIFFE
1662
1662
EMPFEHLEN
-
25.04.12 15:00 #1
Mitglied Silber
- Registriert seit
- Oct 2011
- Beiträge
- 62
Hallo,
ich möchte eine Slideshow mit der Nivo Slideshow erstellen. Gibt es eine Möglichkeit die Höhe des Divs zu bestimmen? Egal ob ich der ID="slide" eine Höhe definiere es wird laut Firebug immer ein Element Style definiert mit der Höhe des Bildes
Ich möchte z.b. den div ein height von 320px geben und der Rest von Bild soll abgeschieden werden.
Mein Code
Das ###IMAGE### wird durch PHP ersetztHTML-Code:<link href="typo3conf/ext/nslideshow/res/css/nivo-slider.css" rel="stylesheet" type="text/css"> <script type='text/javascript' src='typo3conf/ext/nslideshow/res/js/jquery.nivo.slider.js'></script> <script type="text/javascript"> $(document).ready(function() { $('#slider').nivoSlider({ effect: 'fade', // 'random' oder Übergangseffekte auflisten z.B: 'fold,fade,sliceDown' slices: 15, // Anzahl der Streifen für den Slice-Effekt boxCols: 8, // Anzahl der Spalten für den Box-Effekt boxRows: 4, // Anzahl der Zeilen für den Box-Effekt animSpeed: 500, // Geschwindigkeit des Übergangseffektes pauseTime: 3000, // Zeit wie lange jedes Bild angezeigt wird startSlide: 0, // Nummer des Bildes mit dem gestartet werden soll (die Zählung beginnt mit 0) directionNav: false, // Ob Vor- & Zurücknavigation angezeigt werden soll directionNavHide: true, // Navigation nur anzeigen wenn der Mauszeiger auf einem Bild ist controlNav: false, // Ob eine 1,2,3... Navigation angezeigt werden soll controlNavThumbs: false, // Ob Miniaturbilder zur Navigation angezeigt werden sollen controlNavThumbsFromRel: false, // Das rel Attribut bei der Navigation mit Miniaturbildern verweden controlNavThumbsSearch: '.jpg', // Welche Bilder für die Miniaturbilder verwendet werden sollen controlNavThumbsReplace: '_thumb.jpg', // controlNavThumbsSearch hiermit ersetzen um die Namen der Miniaturbilder zu erhalten keyboardNav: false, // Ob Links- & Rechtspfeile des Keyboards zur Navigation verwendet werden sollen pauseOnHover: true, // Ob die Animation angehalten werden soll wenn der Mauszeiger auf einem Bild ist manualAdvance: false, // Ob die Animation nur manuell erfolgt captionOpacity: 0.8, // Durchsichtigkeitsfaktor der Bildtexte prevText: 'Prev', // Text für die Zurück-Navigation nextText: 'Next', // Text für die Vor-Navigation randomStart: false, // Ob mit einem zufälligen Bild gestartet werden soll beforeChange: function(){}, // Funktion die vor einem Bildübergang aufgerufen wird afterChange: function(){}, // Funktion die nach einem Bildübergang aufgerufen wird slideshowEnd: function(){}, // Funktion die nach allen Bildübergängen aufgerufen wird lastSlide: function(){}, // Funktion die aufgerufen wird wenn das letzte Bild angezeigt wird afterLoad: function(){} // Funktion die aufgerufen wird wenn der Slider geladen ist }); }); </script> <div id="slider" class="nivoSlider" style="height:10px"> ###IMAGE### </div> <div id="infos">###INFO###</div>
Ich könnte zwar das Bild Skalieren, aber der Kunde will das abgeschnieden haben.PHP-Code:$markerArray["###IMAGE###"] .= "<a href='index.php?id=$link'>" . $this->cObj->IMAGE($tsimage) . "</a>";
Hoffe auf eure Hilfe.
Danke im Vorraus
PCGamer
-
25.04.12 15:43 #2
overflow:hidden sorgt dafür, übergroße Inhalte abzuschneiden.
-
25.04.12 16:08 #3
Mitglied Silber
- Registriert seit
- Oct 2011
- Beiträge
- 62
Vielen dank für die Antwort. Leider hilft dieses nicht, da ja der Nivo Slider eine eigene Größe (Bildgröße) als Element.Style des Divs generiert. Um das nochmal anschaulicher zu machen meine CSS und das generierte Element.Style von der Nivo Slideshow:
Css:
Code :1 2 3
#slider { height: 320px; }
und das generierte Element.Style:
somit wird mein definiertes Style von der id="slide" (height=320px) von den Element.Style (height=537px) überschriebenHTML-Code:<div style="height: 537px; position: relative; background: url("typo3temp/pics/631fec7cba.jpg") no-repeat scroll 0% 0% transparent;" class="nivoSlider" id="slider">
Kann man verhindern das ein Height in Element.Style generiert wird=
-
25.04.12 16:44 #4
Die gewünschte Höhe muß im CSS (nivo-slider.css) über diesen Selektor festgelegt werden:
Code css:1 2 3 4
.nivoSlider img { ... height:320px; }
Geändert von spicelab (25.04.12 um 16:59 Uhr)
-
25.04.12 19:21 #5
Mitglied Silber
- Registriert seit
- Oct 2011
- Beiträge
- 62
Vielen dank
Ähnliche Themen
-
nivo-slider start erst nach mouse hoover
Von mike4 im Forum Javascript & AjaxAntworten: 5Letzter Beitrag: 01.07.11, 09:38 -
Problem mit Nivo Slider
Von ciberjoerg im Forum HTML & XHTMLAntworten: 4Letzter Beitrag: 17.09.10, 22:12 -
RGB Slider
Von julepul im Forum Flash PlattformAntworten: 10Letzter Beitrag: 15.11.09, 15:14 -
Tab Slider in CSS?
Von deepgreen im Forum CSSAntworten: 3Letzter Beitrag: 27.06.08, 19:10 -
Mehrspaltiges Layout: Probleme mit min-height:100% bzw height:100%
Von gunwald im Forum CSSAntworten: 0Letzter Beitrag: 22.01.07, 20:00




Zitieren

Login