Suche
Teilen
startseite » forum

[Frage] YAG - Nivo-Slider Größe ändern ?

  • daisy42 daisy42
    T3PO
    0 x
    27 Beiträge
    0 Hilfreiche Beiträge
    03. 01. 2015, 20:54

    Hallo zusammen,

    ich verzweifele grad daran für die YAG-Gallerie mit dem Theme "Nivo-Slider" die Größe zu ändern.

    Meine Bilder sind alle im selben Format 254x410 Pixel

    Die von mir angelegte nivo-slider.css wird auch korrekt eingebunden

    Leider habe ich es bisher nicht geschafft entweder in der CSS oder im angelegten ext-Template-Code oder in der default.css vom nivoSlider unter typo3conf/... die Größe zu ändern. Es tut sich einfach NICHTS

    Bitte gebt mir einen Tipp an welcher Stelle ich hier nochmal nachschauen muss, ich verzweifele grad echt

    Ach so, Typo3 6.1.7, YAG aktuelle Version

    Link zur Testseite[url]http://waeldin.marwebs.de/index.php?id=9[/url]

    Hier noch die nivo-slider.css:

    1. /*
    2.  * jQuery Nivo Slider v3.2
    3.  * http://nivo.dev7studios.com
    4.  *
    5.  * Copyright 2012, Dev7studios
    6.  * Free to use and abuse under the MIT license.
    7.  * http://www.opensource.org/licenses/mit-license.php
    8.  */
    9.  
    10. /* The Nivo Slider styles */
    11.  
    12. .theme-default .nivoSlider img {
    13.     position:absolute;
    14.     top:0px;
    15.     left:0px;
    16.     display:none;
    17.     width: 254px;
    18.     height: 410px !important;
    19. }
    20.  
    21. .nivoSlider {
    22.   #position:relative;
    23.   position:absolute;
    24.   #width:100%;
    25.   #height:auto;
    26.   overflow: hidden;
    27.   height: 410px; /* Make sure your images are the same size */
    28.   width: 254px; /* Make sure your images are the same size */    
    29. }
    30. .nivoSlider img {
    31.   height: 410px; /* Make sure your images are the same size */
    32.   width: 254px; /* Make sure your images are the same size */    
    33.   #position:absolute;
    34.   position:relative;
    35.   top:0px;
    36.   left:0px;
    37.   max-width: none;
    38.   display:none;
    39. }
    40. .nivo-main-image {
    41.   #display: block !important;
    42.   #position: relative !important;
    43.   #width: 100% !important;
    44. }
    45.  
    46. /* If an image is wrapped in a link */
    47. .nivoSlider a.nivo-imageLink {
    48.   position:absolute;
    49.   top:0px;
    50.   left:0px;
    51.   width:100%;
    52.   height:100%;
    53.   border:0;
    54.   padding:0;
    55.   margin:0;
    56.   z-index:6;
    57.   display:none;
    58.   background:white;
    59.   filter:alpha(opacity=0);
    60.   opacity:0;
    61. }
    62. /* The slices and boxes in the Slider */
    63. .nivo-slice {
    64.   display:block;
    65.   position:absolute;
    66.   z-index:5;
    67.   height:100%;
    68.   top:0;
    69. }
    70. .nivo-box {
    71.   display:block;
    72.   position:absolute;
    73.   z-index:5;
    74.   overflow:hidden;
    75. }
    76. .nivo-box img { display:block; }
    77.  
    78. /* Caption styles */
    79. .nivo-caption {
    80.   position:absolute;
    81.   left:0px;
    82.   bottom:10px; /* Caption-Balken - Abstand nach unten */
    83.   background:#4FCAFF; /* Türkis */
    84.   color:#3F48CC; /* Blau */
    85.   width:100%;
    86.   z-index:8;
    87.   padding: 5px 10px;
    88.   opacity: 0.8;
    89.   overflow: hidden;
    90.   display: none;
    91.   -moz-opacity: 0.8;
    92.   filter:alpha(opacity=8);
    93.   -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    94.   -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    95.   box-sizing: border-box;         /* Opera/IE 8+ */
    96.   height:55px;
    97. }
    98. .nivo-caption p {
    99.   padding:5px;
    100.   margin:0;
    101. }
    102. .nivo-caption a {
    103.   display:inline !important;
    104. }
    105. .nivo-html-caption {
    106.     display:none;
    107. }
    108. /* Direction nav styles (e.g. Next & Prev) */
    109. .nivo-directionNav a {
    110.   position:absolute;
    111.   top:45%;
    112.   z-index:9;
    113.   cursor:pointer;
    114. }
    115. .nivo-prevNav {
    116.   left:0px;
    117. }
    118. .nivo-nextNav {
    119.   right:0px;
    120. }
    121. /* Control nav styles (e.g. 1,2,3...) */
    122. .nivo-controlNav {
    123.   text-align:center;
    124.   padding: 15px 0;
    125. }
    126. .nivo-controlNav a {
    127.   cursor:pointer;
    128. }
    129. .nivo-controlNav a.active {
    130.   font-weight:bold;
    131. }

  • 1
  • toifel toifel
    Jedi-Ratsmitglied
    0 x
    831 Beiträge
    96 Hilfreiche Beiträge
    05. 01. 2015, 11:06

    Blick ins Template des Nivo-Sliders zeigt:

    1. <div id="nivoSlider-{config.contextIdentifier}" class="nivoSlider" style="width:{listData.firstRow.image.value.resolutions.medium.width}px; height:{listData.firstRow.image.value.resolutions.medium.height}px;">

    Hat wohl was mit den resolutionConfigs zu tun.. http://docs.typo3.org/typo3cms/extensions/yag/Yag-YetAnotherGallery/Configuration/TyposcriptReference/Index.html#plugin-tx-yag-settings-themes-default

  • bernds bernds
    TYPO3-Anwärter
    0 x
    4 Beiträge
    0 Hilfreiche Beiträge
    26. 02. 2015, 22:07

    Hallo,
    ich hatte das Problem auch. Ich habe allerdings "Rondell" benutzt.
    Meine Lösung war folgende:
    Die Einstellungen werden in das Setup der Seite geschrieben. Die Werte für die Einstellungen findest du über den Typoscript-Objekt-Browser oder die Doku des Plugins.

    Mein Beispiel:
    plugin.tx_yag.settings.themes.rondell[b].javaScriptSettings.rondell[/b] {
    center {
    top = 220
    left = 400
    }
    fadeTime = 1000
    autoRotation {
    delay = 10000
    }
    radius {
    x = 400
    y = 200
    }

    itemProperties {
    sizeFocused {
    width = 600
    height = 400
    }
    size {
    width = 320
    height = 240
    }
    }
    }

    Was in der Doku nicht stand, war die Angabe ".javascriptSettings.Rondell" Erst damit hat es aber funktioniert. Dank dem Programmierer der Extension, der mir den Tipp gab.

    Gruß
    bernds

  • daisy42 daisy42
    T3PO
    0 x
    27 Beiträge
    0 Hilfreiche Beiträge
    26. 02. 2015, 23:50

    Klingt super, ich werds ausprobieren. Danke @bernds

  • bernds bernds
    TYPO3-Anwärter
    0 x
    4 Beiträge
    0 Hilfreiche Beiträge
    06. 04. 2015, 14:46

    Und, hat es funktioniert?

  • 1
Präsentiert von