Logbuch
Contao 3 - Out of the box Content Slider responsive
zuerst bindet man ein klassisches Script ein, das die Bildschirmbreite (Höhe) des Browsers überwacht. Ich habe hier ein Script verwendet, dass ich schon vor Jahren verwendet habe, um Meldungen zentriert im Browser auszugeben. Man findet aber auch alle anderen möglichen Varianten im Netz.
function Fensterweite() {
if (window.innerWidth) {
return window.innerWidth; }
else if (document.body && document.body.offsetWidth)
{
return document.body.offsetWidth;
}
else {
return 0;
}}
function neuAufbau() {
if (Weite != Fensterweite())
contaoSlider();
}
/* Überwachung von Internet Explorer initialisieren */
if (!window.Weite && document.body && document.body.offsetWidth) {
window.onresize = neuAufbau;
Weite = Fensterweite();
}
/* Überwachung von Netscape initialisieren */if (
!window.Weite && window.innerWidth) {
window.onresize = neuAufbau;
Weite = Fensterweite();
}
im Anschluss muss man nur noch dem die Breite des Sliders anpassen:
////////////////////////////////////////////// Sliderfunction
contaoSlider() {
var FensterBreite = Fensterweite();
var SliderBreite = FensterBreite - 30 +"px";
if ($('.slider-wrapper').length > 0){
$('.ce_sliderStart').css('width', SliderBreite);
}}
Blog News
Blog Cloud
- Accordion
- Affinity
- Allen & Heath
- Apple
- Benutzer
- Browser
- Bug
- Chrome
- CMS
- Contao
- Contao 4
- Controller
- Crative Suite
- CS6
- CSS
- DB2
- Design
- Erweiterung
- Festivals
- Font
- Fonts
- Grundlinienraster
- grunt
- Hardware
- Hosting
- House
- HTML5
- IE7
- Indesign
- Internet
- iOS
- iPad
- iTunes
- Layout
- Live
- Mac
- Mac Book
- Mamp
- Mischpult
- Mixer
- mobiler
- Mukke
- Music
- Netzwerk
- OS X
- OSX
- PC
- Pfronten
- Photo
- php
- Player
- Preview
- Publisher
- Quark
- Quark XPress
- Raster
- Reisen
- Router
- safari
- Schlüsselbund
- schneiden
- Schriften
- Script
- SEO
- Server
- Set
- Shell Script
- Slider
- Smartwatch
- Snow Board
- Software
- Soundkarte
- SSD
- syncen
- Synology
- Techno
- Terminal
- thunderbolt
- Time Mashine
- Traktor
- Trimm
- Tweets
- Typografie
- typografisches Raster
- typoman
- Unterstützung
- Up
- Video
- Vite
- Web
- Webfont
- Webfonts
- Webserver
- Website
- Wifi
- Windows
- Wlan
- Xone
Kommentare
Kommentar von mark
FUnktioniert bei mir mit contao 3 nicht hast du das selbst bei dir auch mal ausprobiert?
Antwort von Philipp Kayser
Hi Mark,
das liegt daran, dass das Inhaltselement Conten-Slider in Contao 3 bereits responsive ist, bzw. mit ein wenig css so angepasst werden kann, dass der von mir geschriebene Artikel aus dem Jahr 2014 überflüssig ist. Du solltest halt darauf achten, dass im Seitenlayout das jQuery Template -[gt] slider ein Häkchen hat.[nbsp]
Schöne Grüße
Phil