Ergebnis 1 bis 8 von 8

Thema: Flexibler Slider in Breite und Höhe

  1. #1
    Contao-Fan Avatar von dirksche
    Registriert seit
    05.08.2009.
    Ort
    Grosslittgen
    Beiträge
    644

    Standard Flexibler Slider in Breite und Höhe

    Hallo liebe Community,

    ich versuche gerade eine Seite mit folgendem Layout Umzusetzen: http://www.ensch-media.de/webserver/broy/index.php
    Ich habe mir mal die Erweiterung jedoFlexSlider installiert und bekomme es einfach nicht hin, das sich die Fotos auch in der Höhe skalieren. Wenn ich das Browserfenster in der Breite verkleinere, werden die Bilder skaliert. Wenn ich nur die Höhe verändere, skaliert er leider nicht und der Browser blendet den Scrollbalken ein. Hat jemand eine Idee?

    Liebe Grüße,
    Dirk

  2. #2
    Contao-Nutzer Avatar von Skipman
    Registriert seit
    13.08.2011.
    Ort
    Nähe St. Pölten / Niederösterreich
    Beiträge
    52
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Ich kenne den FlexSlider zwar nicht, aber ich würde an 2 Dinge dabei denken:

    1. Dem Quelltext der Beispielseite ist zu entnehmen, dass das umgebende div und das Bild unterschiedliche Größenangaben aufweisen. Hast Du in diese Richtung schon was ausprobiert?
    2. Bei normalen Bildern verwende ich oft die "auto"-Anweisung entweder bei der Höhe oder der Breite. Auch die max-width / max-height könnte hilfreich sein .
    barrierearmes Webdesign, HTML, CSS, Validierung, CO/BODA, Contao - Webdesign - Hosting - Schulung

  3. #3
    Contao-Nutzer
    Registriert seit
    03.11.2012.
    Beiträge
    1

    Standard Interessanter Banner

    Ich finde den Banner auf http://www.ensch-media.de/webserver/broy/index.php sehr interessant. Ich bin neu hier und lerne gerade das programmieren und bin auf der Suche nach solch einem Banner? Ist er schwierig zu programmieren? Würde mich auf ein Feedback freuen.

  4. #4
    Alter Contao-Hase Avatar von bizon
    Registriert seit
    16.06.2010.
    Beiträge
    1.125

    Standard

    @dirksche
    In den Slidereinstellung keine Breiten- oder Höhenangaben machen, da ja alles flexibel sein soll.

    Die Slides sollten alle die gleichen Breiten und Höhen haben.
    img bekommen im CSS alle width: 100%; so dass Sie automatisch die Breite des umschließenden divs einnehmen (bei dir wahrscheinlich Breite von #header)

    @gabrielkhod
    Um einen Slider in Contao einzubauen, musst du nicht unbedingt programmieren können, sondern du musst dich mit dem System Contao zunächst auseinandersetzen und einiges über CSS wissen. Die Slider werden als sogenannte Extensions eingebunden.

    Grundinformationen stehen im Wiki
    Eine Sliderauswahl für Contao 2.11.x gibt es hier
    Geändert von bizon (03.11.2012 um 22:27 Uhr)

  5. #5
    Contao-Nutzer
    Registriert seit
    19.12.2012.
    Beiträge
    36

    Standard

    Hallo Zusammen,

    ich habe ebenfalls die Erweiterung FlexSlider installiert und nun meine Probleme bei der Inbetriebnahme (Conto 3.0.1).

    Für meinen Test verwende ich zwei Bilder. Per CSS-Formatierung bekomme ich die Gestaltung des Rahmens hin, allerdings werden keine Bilder angezeigt. Ich habe versucht die Größe des "img" anzupassen, da ich hier meine Fehler vermutet habe. Aber ich bekomme es leider nicht hin. Hier habe ich mal den html Code sowie meine CSS-Formatierung:

    HTML:

    HTML-Code:
    <h1 class="ce_headline">Servus ihr Nulpen</h1>
    <!-- indexer::continue -->
    
    <!-- indexer::stop -->
    <div class="ce_text block">
    
    <p>Ich freue mich, dass ihr es geschafft habt unsere Website zu besuchen. Die Seite ist dafür gedacht Infos auszutauschen, Termine zu organisieren, und vergangene Treffen zu würdigen. Wenn wir es schaffen, diese Seite ein wenig zu pflegen, dann denke ich haben wir noch sehr lange etwas davon.&nbsp;</p>
    </div>
    <!-- indexer::continue -->
    
    <!-- indexer::stop --><section class="ce_flexSlider block">
        
        
                    
                    <div class="white">
            <div id="startseite" class="flexslider">
              <ul class="slides">
            		     		<li><img alt="" src="files/fuenf_maenner/Fotos/startseite_Slideshow/Benni%20045.jpg" />
    										</li>
    			  				 		     		<li><img alt="" src="files/fuenf_maenner/Fotos/startseite_Slideshow/DSC08755.JPG" />
    										</li>
    			  				           </ul>
            </div>
            </div>
                    
        
    </section>
    
    
    <script>
    $(window).load(function() {
      $('#startseite').flexslider({
    	slideshowSpeed: 3000,
    	animationSpeed: 600,
        animation: "slide",
    	direction: "horizontal",
    		    controlNav: false,
    		    directionNav: false,
    		randomize: false,
    		    pauseOnHover: true,
        		pauseOnAction: true,
    	useCSS: false,
        touch: true
      });
    });
    </script>
    <!-- indexer::continue -->
    CSS:
    Code:
    /** Slideshow **/
    div.flexslider {
        width:200px;
        height:200px;
    }
    
    ul.flexslider {
        width:200px;
        height:200px;
    }
    
    .startseite img {
        width:100%;
        height:100%;
    }
    Vielleicht kann mir jemand bei der CSS-Formatierung oder auf andere Weise helfen.

    Vielen Dank!

  6. #6
    Contao-Fan
    Registriert seit
    05.11.2009.
    Ort
    Liebschützberg (Sachsen)
    Beiträge
    527

    Standard

    Hallo 00Snider,

    du hast vermutlich vergessen, im Seitenlayout den Haken bei: jQuery laden zusetzen!

    Steffen Winde

  7. #7
    Contao-Nutzer
    Registriert seit
    19.12.2012.
    Beiträge
    36

    Standard

    Hallo Steffen,

    danke für den Hinweis! Das wars...Die Bilder werden jetzt angezeigt allerdings passt die Formatierung noch in keinster Weise...

    Damit muss ich mich jetzt mal noch auseinander setzten.

    Danke für deine Hilfe!

  8. #8
    Contao-Nutzer
    Registriert seit
    19.12.2012.
    Beiträge
    36

    Standard

    Hallo,

    ich versuche immernoch verzweifelt den FlexSlider auf meiner Seite richtig einzubinden. Den Rahmen der Bilder wird an der richtigen Stelle angezeigt und ich kann ihn per CSS formatieren. Die Bilder hängen jedoch am Ende der Seite und füllen die gesamte Spaltenbreite aus. An sich scheint die Slideshow zu funktionieren.

    Ich hab in einem anderen Beitrag gelesen, dass die Slideshow immer auf 100% eines umgebenden Elements angepasst wird. Wird die Slideshow bei mir evtl. über die gesamte Spaltenbreite skaliert, da ich sie in die Hauptspalte eingebunden habe? Dann weiß ich allerdings nicht, wie ich die Slideshow in der Hauptspalte skalieren kann...

    Wäre super, wenn mir nochmal jemand weiterhelfen könnte!

    Danke!

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •