Parameter und Beispiele
 |
Hauptparameter
| Einstellung | Wert |
|---|---|
| Geschwindigkeit Animation | Legen Sie die Geschwindigkeit der Animation fest |
| Autoplay | (Ja | Nein) Aktivieren oder deaktivieren des Autoplay |
| Geschwindigkeit Autoplay | Legen Sie die Geschwindigkeit der automatischen Wiedergabe in Millisekunden fest. Sie muss größer sein als die Summe der Zeiten aller Animationen. |
| Vor/Zurück | (Ja | Nein) Aktivieren oder deaktivieren der Vor/Zurück Navigation. |
| Dots | (Ja | Nein) Aktivieren oder deaktivieren der Dots Navigation |
| Höhe | Legen Sie die Höhe der Slideshow fest. Zum Beispiel: '70vh'. Wird ignoriert wenn der 'Rest der Seite ausfüllen' Parameter aktiviert ist. |
| Rest der Seite ausfüllen | (Ja | Ja (50 %) | Ja (67 %) | Ja (75 %) | Nein) Aktivieren oder deaktivieren Sie die volle Höhe. Die Slideshow füllt den Rest der Seite auf großen Bildschirmen aus. |
| Rest der Seite ausfüllen - Seitenverhältnis (Kleine Bildschirme) | Wenn das Ausfüllen des restlichen Seitenbereichs auf großen Bildschirmen aktiviert ist, können Sie hier das Verhältnis zwischen Breite und Höhe festlegen, um die Größe auf kleinen Bildschirmen zu korrigieren. |
| Slideshow anzeigen(Minimale Breite) | Legen Sie fest, ab welcher Breite die Slideshow angezeigt werden soll |
| Hintergrundbild | Gewünschtes Hintergrundbild wählen. Dieses Hintergrundbild gilt für alle Slides und kann durch das Hintergrundbild jedes Slides überschrieben werden. |
| Hintergrundvideo | Legen Sie das Hintergrundvideo fest (verwenden Sie den vollständigen Pfad, zum Beispiel: images / video.mp4). Das Video wird nur angezeigt, wenn kein Hintergrundbild und kein Hintergrundelementbild festgelegt ist. |
| Anzeigen (Komponente) | Legen Sie die Komponente fest, in der das Karussell angezeigt werden soll. Wenn Sie mehrere Komponenten festlegen möchten, trennen Sie die einzelnen Komponenten durch Kommas (,). Zum Beispiel: com_phocacart, com_phocadownload, com_phocagallery. Leer lassen, um das Karussell überall anzuzeigen. |
| Anzeigen (Ansicht) | Legen Sie die Ansicht fest, in der das Karussell angezeigt werden soll. Wenn Sie mehrere Ansichten festlegen möchten, trennen Sie die einzelnen Ansichten durch Kommas (,). Zum Beispiel: categories, category, item. Wenn Sie die Ansicht festlegen, muss auch die Komponente festgelegt werden. Leer lassen, um das Karussell überall anzuzeigen. |
| Anzeige ID | Legen Sie die ID fest, unter der das Karussell angezeigt werden soll. Wenn Sie weitere IDs festlegen, trennen Sie jede ID durch Komma (,). Wenn Sie die ID festlegen, müssen auch die Ansicht und die Komponente festgelegt werden. Leer lassen, um das Karussell überall anzuzeigen. |
Elementeparameter
| Einstellung | Wert |
|---|---|
| Hintergrundbild | Gewünschtes Hintergrundbild wählen |
| Hintergrundbild Animation | Hintergrundbild Animation einfügen. Zum Beispiel: 'kenburnsBottomLeft' |
| Titel | Titel einfügen |
| Titel CSS | Titel CSS einfügen |
| Titel Animation | Titel Animation einfügen. Zum Beispiel: 'fadeIn' |
| Beschreibung | Beschreibung einfügen |
| Beschreibung CSS | Beschreibung CSS einfügen |
| Beschreibung Animation | Beschreibung Animation einfügen. Zum Beispiel: 'bounceInLeft' |
| Button Titel | Button Titel einfügen |
| Button Link | Button Link einfügen |
| Button CSS | Button CSS einfügen |
| Button Animation | Button Animation einfügen. Zum Beispiel: 'zoomIn' |
| Erstes Bild | Erstes Bild wählen |
| Erstes Bild CSS | Erstes Bild CSS einfügen |
| Größe erstes Bild CSS | Größe erstes Bild CSS einfügen |
| Erstes Bild Animation | Erstes Bild Animation einfügen. Zum Beispiel: 'bounceInDown' |
| Zweites Bild | Zweites Bild wählen |
| Zweites Bild CSS | Zweites Bild CSS einfügen |
| Größe zweites Bild CSS | Größe zweites Bild CSS einfügen |
| Zweites Bild Animation | Zweites Bild Animation einfügen. Zum Beispiel: 'bounceInDown' |
Beispiele für Elementeparameter:
Titel CSS:
animation-duration: 5s; animation-delay: 0s; position: absolute; left: 26%; top: 15%; font-size: 4vw; z-index: 1000; text-align: center; color: #fff; font-weight: bold;
Beschreibung CSS:
animation-duration: 6s; animation-delay: 3s; position: absolute; left: 29%; top: 28%; z-index: 1000; padding: 1vw; font-size: 3vw; line-height: 1.3; color: #fff;
Button CSS:
animation-duration: 1s; animation-delay: 4s; position: absolute; bottom: 25%; padding: 9vw auto; border: 4px solid #DAA520; color: #DAA520; margin-left: auto; margin-right: auto; left: 0; right: 0; text-align: center; z-index: 1001; width: 20vw; font-size: 2vw; text-transform: uppercase; white-space: nowrap; background: rgba(0,0,0,0.1);
Erstes Bild CSS:
animation-duration: 2s; animation-delay: 2s; position: absolute; bottom: 20%; left: 7%; z-index: 1002;
Erstes Bild Größe:
height: 20vw; width: auto;
Zweites Bild CSS:
animation-duration: 1s; animation-delay: 3s; position: absolute; bottom: 0%; right: 10%; z-index: 1003;
Zweites Bild Größe:
height: 34vw; width: auto;
Sie können die Slideshow hier sehen: Phoca Premiere Temlate Demo
Stand: Phoca Carousel Modul v3.0.3 (03.10.2020)
