CMS-Jack
Tutorials » Image Carousel mit Minibilder
Image Carousel mit Minibilder - 

Image Carousel mit Minibilder

Um als Navigation Minibilder im Image Carousel anzuzeigen, muss mindestens die version 1.2.1 installiert sein. Damit die Minibilder erstellt werden muss im Setup folgendes Typoscript eingebunden werden:

plugin.tx_imagecarousel_pi1 {
  carousel.normal {
    navigation = COA
    navigation {
      10 = TEXT
      10 {
        value = <a href="#" rev="{register:CURRENT_ID}">
        insertData = 1
      }
      20 = IMAGE
      20 {
        file.import.data = register:file
        file.width = 20c
        file.height = 20c
      }
      30 = TEXT
      30.value = </a>
    }
  }
  _CSS_DEFAULT_STYLE (
.jcarousel-container { position: relative; }
.jcarousel-clip { z-index: 2; padding: 0; margin: 0; overflow: hidden; position: relative; }
.jcarousel-list { z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0; }
.jcarousel-list li,.jcarousel-item { float: left; list-style: none; margin: 0 10px 0 0; }
.jcarousel-next { z-index: 3; display: none; }
.jcarousel-prev { z-index: 3; display: none; }
.jcarousel-control { margin-bottom: 10px; text-align: center; }
.jcarousel-control a { font-size: 75%; text-decoration: none; margin: 0 5px 5px 0; }
.csc-textpic-intext-left .jcarousel-clip ul { padding: 0; overflow: hidden; position: relative; }
  )
}

Danach einfach das Plugin einbinden, die Bilder auswählen und folgende Einstellung vornehmen:

 

Ergebnis

  • Fahrstunden
  • Lagua
  • Sonnenuntergang
  • Aussicht
  • Brasilia
  • Antenne
  • Lagua 2
  • Diffus
  • Hintergrundleuchten