menu
Slider: standaard instellingen aanpassen
Let op:
Dit is een geavanceerde functie en verondersteld enige basis kennis van Javascript en CSS. Wij bieden geen support op het debuggen van Javascript of CSS, anders dan het verwijderen van de complete zelf ingevoerde code.
Indien de code verkeerd wordt ingevoerd kan het zijn dat delen van de site of zelfs de gehele site niet meer naar behoren werkt.
Optie 1: Javascript toevoegen aan de gehele site
Klik op 'geavanceerde instellingen' (slotje) > 'instellingen: opmaak & extra html opties' > 'html: custom JS voor gehele website' > voeg de Javascript code toe in het veld en klik op 'opslaan'.
Optie 2: Javascript toevoegen aan een pagina
Klik op 'pagina's' > klik 'bewerk' bij de betreffende pagina > 'menu / pagina instellingen' > 'geavanceerde instellingen' > 'custom js' > voeg de Javascript code toe in het veld en klik op 'opslaan'.
Code snippets
Slider interval aanpassen
-
// slider interval, dus de tijd dat een afbeelding blijft staan aanpassen -
// verhoog of verlaag het getal (standaard 3000 milliseconden) -
$('#teaser').autoscroll({ interval: 3000 });
Slider snelheid aanpassen
-
// slider snelheid -
// verhoog of verlaag het getal (standaard 1000 milliseconden) -
$('#teaser').scrollable().getConf().speed = 1000;
Slider toetsenbord navigatie uitschakelen
-
// slider keyboard navigatie -
// standaard is het mogelijk om mbv de pijltjes toetsen te navigeren tussen de -
// verschillende afbeeldingen in de slider. Schakel deze optie uit. -
$('#teaser').scrollable().getConf().keyboard =false;
Slider navigatie mbv mousewheel uitschakelen
-
//slider mousewheel navigatie -
// schakel mogelijkheid om mbv mousewheel te navigeren uit -
$('#teaser').scrollable().getConf().mousewheel = false;
Slider easing aanpassen
Easing opties:
swing
easeInQuad
easeOutQuad
easeInOutQuad
easeInCubic
easeOutCubic
easeInOutCubic
easeInQuart
easeOutQuart
easeInOutQuart
easeInQuint
easeOutQuint
easeInOutQuint
easeInSine
easeOutSine
easeInOutSine
easeInExpo
easeOutExpo
easeInOutExpo
easeInCirc
easeOutCirc
easeInOutCirc
easeInElastic
easeOutElastic
easeInOutElastic
easeInBack
easeOutBack
easeInOutBack
easeInBounce
easeOutBounce
easeInOutBounce
Demo van de verschillende mogelijkheden.
Het effect is afhankelijk van de gekozen optie + speed.
-
// slider easing -
// kies optie uit de lijst hieronder (standaard = 'easeInOutExpo') -
$('#teaser').scrollable().getConf().easing = 'easeInOutExpo';
