FlexSlider: verschil tussen versies
Geen bewerkingssamenvatting |
Geen bewerkingssamenvatting |
||
| (2 tussenliggende versies door dezelfde gebruiker niet weergegeven) | |||
| Regel 1: | Regel 1: | ||
<languages /> | <languages /> | ||
<translate> | <translate> | ||
FlexSlider is een geweldige, volledig responsieve jQuery-slider-toolkit. Het is | <!--T:1--> | ||
FlexSlider is een geweldige, volledig responsieve jQuery-slider-toolkit. Het is mee geïnstalleerd met de template FR Classic, klaar voor gebruik. | |||
<!--T:2--> | |||
'''Functies''' | '''Functies''' | ||
<!--T:3--> | |||
* Eenvoudige, semantische opmaak | * Eenvoudige, semantische opmaak | ||
* Wordt ondersteund door alle gangbare browsers | * Wordt ondersteund door alle gangbare browsers | ||
| Regel 14: | Regel 17: | ||
<!--T:4--> | |||
Bezoek de [http://flexslider.woothemes.com FlexSlider pagina] van Woo Themes voor voorbeelden. | Bezoek de [http://flexslider.woothemes.com FlexSlider pagina] van Woo Themes voor voorbeelden. | ||
<!--T:5--> | |||
Per voorbeeld kan je de html broncode kopiëren en plakken in een sectie op jouw website. | Per voorbeeld kan je de html broncode kopiëren en plakken in een sectie op jouw website. | ||
<!--T:6--> | |||
== Toepassing == | == Toepassing == | ||
[[File:Knop Broncode.png|alt=knop Broncode|left]] | [[File:Knop Broncode.png|alt=knop Broncode|left]] | ||
| Regel 23: | Regel 29: | ||
<!--T:7--> | |||
Plaats de volgende broncode:<syntaxhighlight lang="html"> | Plaats de volgende broncode:<syntaxhighlight lang="html"> | ||
<!-- Place somewhere in the <body> of your page --> | <!-- Place somewhere in the <body> of your page --> | ||
| Regel 43: | Regel 50: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
<!--T:8--> | |||
== Geavanceerde optie's == | == Geavanceerde optie's == | ||
Op de Github pagina van de ontwikkelaar, Woocommerce, staan alle ingebouwde functionaliteiten beschreven. [https://github.com/woocommerce/FlexSlider/wiki/FlexSlider-Properties Link naar pagina] | Op de Github pagina van de ontwikkelaar, Woocommerce, staan alle ingebouwde functionaliteiten beschreven. [https://github.com/woocommerce/FlexSlider/wiki/FlexSlider-Properties Link naar pagina] | ||
<!--T:9--> | |||
Andere pagina's met voorbeelden en handleidingen: | Andere pagina's met voorbeelden en handleidingen: | ||
<!--T:10--> | |||
[https://www.myjqueryplugins.com/jquery-plugin/flexslider/ MyjQuery Plugins] | [https://www.myjqueryplugins.com/jquery-plugin/flexslider/ MyjQuery Plugins] | ||
<!--T:11--> | |||
[https://manuals.muthu.co/posts/javascript-libraries-and-functions/flexslider.html Muthu Manuals] | [https://manuals.muthu.co/posts/javascript-libraries-and-functions/flexslider.html Muthu Manuals] | ||
<!--T:12--> | |||
[https://www.jqueryscript.net/slider/Awesome-Fully-Responsive-jQuery-Slider-FlexSlider.html jQuery Script.net] | [https://www.jqueryscript.net/slider/Awesome-Fully-Responsive-jQuery-Slider-FlexSlider.html jQuery Script.net] | ||
</translate> | </translate> | ||
Huidige versie van 15 jul 2026 19:22
FlexSlider is een geweldige, volledig responsieve jQuery-slider-toolkit. Het is mee geïnstalleerd met de template FR Classic, klaar voor gebruik.
Functies
- Eenvoudige, semantische opmaak
- Wordt ondersteund door alle gangbare browsers
- Horizontale en verticale schuif- en fade-animaties
- Ondersteuning voor meerdere schuifbalken, Callback API en meer
- Ondersteuning voor hardwareversnelde veegbewegingen
- Aangepaste navigatieopties
- Compatibel met de nieuwste versie van jQuery
Bezoek de FlexSlider pagina van Woo Themes voor voorbeelden.
Per voorbeeld kan je de html broncode kopiëren en plakken in een sectie op jouw website.
Toepassing
De Flexslider plaats je in een sectie van een pagina. Gebruik de WYSIWYG editor, optie Broncode
Plaats de volgende broncode:
<!-- Place somewhere in the <body> of your page -->
<div class="flexslider">
<ul class="slides">
<li>
<img src="slide1.jpg" />
</li>
<li>
<img src="slide2.jpg" />
</li>
<li>
<img src="slide3.jpg" />
</li>
<li>
<img src="slide4.jpg" />
</li>
</ul>
</div>
Geavanceerde optie's
Op de Github pagina van de ontwikkelaar, Woocommerce, staan alle ingebouwde functionaliteiten beschreven. Link naar pagina
Andere pagina's met voorbeelden en handleidingen: