FlexSlider/en: verschil tussen versies
Bijgewerkt vanwege een nieuwe basisversie van de bronpagina |
Bijgewerkt vanwege een nieuwe basisversie van de bronpagina |
||
| Regel 1: | Regel 1: | ||
<languages /> | <languages /> | ||
<div class="mw-translate-fuzzy"> | <div class="mw-translate-fuzzy"> | ||
FlexSlider is a great, fully responsive jQuery slider toolkit. It's already installed in | FlexSlider is a great, fully responsive jQuery slider toolkit. It's already installed in FR Gallery, ready to use. | ||
</div> | </div> | ||
'''Functions''' | '''Functions''' | ||
* Simple, semantic design | |||
* | * Supported by all major browsers | ||
* | * Horizontal and vertical slide and fade animations | ||
* | * Support for multiple scrollbars, Callback API, and more | ||
* | * Support for hardware-accelerated swiping | ||
* | * Custom navigation options | ||
* | * Compatible with the latest version of jQuery | ||
* | |||
Visit the [http://flexslider.woothemes.com FlexSlider page] on Woo Themes for examples. | |||
For example, you can copy the HTML source code and paste it into a section of your website. | |||
== Usage == | |||
[[File:Knop Broncode.png|alt=knop Broncode|left]] | [[File:Knop Broncode.png|alt=knop Broncode|left]] | ||
Place the Flexslider in a section of a page. Use the WYSIWYG editor and select the “Source Code” option. | |||
Place the following source code:<syntaxhighlight lang="html"> | |||
<!-- Place somewhere in the <body> of your page --> | <!-- Place somewhere in the <body> of your page --> | ||
<div class="flexslider"> | <div class="flexslider"> | ||
| Regel 52: | Regel 43: | ||
</div> | </div> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
== Advanced Options == | |||
The developer's GitHub page, WooCommerce, describes all the built-in features. [https://github.com/woocommerce/FlexSlider/wiki/FlexSlider-Properties Link to page] | |||
Other pages with examples and tutorials: | |||
[https://www.myjqueryplugins.com/jquery-plugin/flexslider/ MyjQuery Plugins] | [https://www.myjqueryplugins.com/jquery-plugin/flexslider/ MyjQuery Plugins] | ||
[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] | ||
[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] | ||
Versie van 15 jul 2026 19:23
FlexSlider is a great, fully responsive jQuery slider toolkit. It's already installed in FR Gallery, ready to use.
Functions
- Simple, semantic design
- Supported by all major browsers
- Horizontal and vertical slide and fade animations
- Support for multiple scrollbars, Callback API, and more
- Support for hardware-accelerated swiping
- Custom navigation options
- Compatible with the latest version of jQuery
Visit the FlexSlider page on Woo Themes for examples.
For example, you can copy the HTML source code and paste it into a section of your website.
Usage
Place the Flexslider in a section of a page. Use the WYSIWYG editor and select the “Source Code” option.
Place the following source code:
<!-- 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>
Advanced Options
The developer's GitHub page, WooCommerce, describes all the built-in features. Link to page
Other pages with examples and tutorials: