Skip to content
This repository was archived by the owner on Oct 16, 2024. It is now read-only.

Commit 9c4e6f8

Browse files
jeffikusjeffikus
committed
Merge pull request #1338 from woothemes/release-2-5-0
Release 2 5 0
2 parents 6df2881 + 507210b commit 9c4e6f8

16 files changed

+239
-22
lines changed

‎README.mdown‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
[![Gitter chat](https://badges.gitter.im/woothemes/FlexSlider.png)](https://gitter.im/woothemes/FlexSlider)
22

3-
# FlexSlider 2.4.0
3+
# FlexSlider 2.5.0
44
http://www.woothemes.com/flexslider/ - Copyright (c) 2015 WooThemes
55

66
## Releases
@@ -19,6 +19,10 @@ To keep up to date with how FlexSlider's development roadmap looks, please see o
1919

2020
## Updates
2121

22+
** Version 2.5.0 **
23+
24+
** Bumped compatibility support starting with jQuery 1.7+. pausePlay icon fix. Firefox touch event fix. Adds customDirectionNav param **
25+
2226
** Version 2.4.0 **
2327

2428
** Update for improved standards. Adds classes to li nav elements. Reset for li elements in stylesheet. **
@@ -44,7 +48,7 @@ To keep up to date with how FlexSlider's development roadmap looks, please see o
4448
## General Notes
4549
FlexSlider is no longer licensed under the MIT license. FlexSlider now uses the license, GPLv2 and later.
4650

47-
In an effort to move the plugin forward, support for jQuery 1.3.2 has been dropped. The plugin now requires jQuery 1.4.2+. If you don't have access to the later versions of jQuery, [FlexSlider 1.8](https://github.com/woothemes/FlexSlider/tree/flexslider1) should be a perfectly suitable substitute for your needs!
51+
In an effort to move the plugin forward, support for jQuery 1.4.2 has been dropped. The plugin now requires jQuery 1.7.0+. If you don't have access to the later versions of jQuery, [FlexSlider 1.8](https://github.com/woothemes/FlexSlider/tree/flexslider1) should be a perfectly suitable substitute for your needs!
4852

4953
Your old styles and properties *might not work out of the box*. Some property names have been changed, noted below, as well as namespacing prefixes being applied to all elements. This means that `.flex-direction-nav .next` is now `.flex-direction-nav .flex-next` by default. The namespacing property is exposed, free for you to change.
5054

@@ -69,6 +73,7 @@ Two new methods are available for adding/removing slides, `slider.addSlide()` an
6973
## Examples
7074

7175
- [Basic Slider](http://flexslider.woothemes.com/)
76+
- [Basic Slider customDirectionNav](http://flexslider.woothemes.com/basic-slider-with-custom-direction-nav.html)
7277
- [Slider w/thumbnail controlNav pattern](http://flexslider.woothemes.com/thumbnail-controlnav.html)
7378
- [Slider w/thumbnail slider](http://flexslider.woothemes.com/thumbnail-slider.html)
7479
- [Basic Carousel](http://flexslider.woothemes.com/basic-carousel.html)
@@ -137,6 +142,11 @@ Previously called "keyboardNav" in v1.8 and below.
137142
### controlsContainer: *{updated}*
138143
`controlsContainer` is one of the more painstaking, potentially confusing properties within FlexSlider. First, the property is no longer required to workaround `overflow: hidden` on slide animation. Second, the property now accepts a **jQuery object**, giving you precise control over the object you want. The plugin no longer attempts to guess what element you are selecting.
139144

145+
### customDirectionNav: *{new}*
146+
`customDirectionNav` allows the ability to add custom directional navigation elements. Can be used in conjunction with controlsContainer for pagination controls container.
147+
148+
*[Example of customDirectionNav being used](http://flexslider.woothemes.com/basic-slider-with-custom-direction-nav.html)*
149+
140150
### sync: *{new}*
141151
`sync` is a new property that will allow other slider(s) to hook into the current slider via a given selector. The selector should describe an object that has already been initialized as a FlexSlider. Right now, `sync` will synchronize animation, play, and pause behaviors. More behaviors can be added in the future as the property matures.
142152

‎changelog.txt‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,4 +10,10 @@ FLEXSLIDER CHANGELOG
1010
* Fix for pauseInvisible attribute for Chrome and the Page Visibility API
1111

1212
2015.02.27 - Version 2.4.0
13-
* Update for improved standards. Adds classes to li nav elements. Reset for li elements in stylesheet.
13+
* Update for improved standards. Adds classes to li nav elements. Reset for li elements in stylesheet.
14+
15+
2015.05.19 - Version 2.5.0
16+
* CSS fix for pausePlay play icon.
17+
* Firefox touchstart event fix.
18+
* Compatibility change for jQuery to 1.7.0+
19+
* Adds customDirectionNav param for custom navigation controls

‎css/theme.less‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -200,7 +200,7 @@
200200

201201
}
202202

203-
.flex-play:before {
203+
&.flex-play:before {
204204

205205
content: @flex-pauseplay-icon-play;
206206

‎demo/basic-carousel.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ <h3 class="header-nav">Other Examples</h3>
2727
<nav>
2828
<ul>
2929
<li><a href="index.html">Basic Slider</a></li>
30+
<li><a href="basic-slider-with-custom-direction-nav.html">Basic Slider customDirectionNav</a></li>
3031
<li><a href="thumbnail-controlnav.html">Slider w/thumbnail controlNav pattern</a></li>
3132
<li><a href="thumbnail-slider.html">Slider w/thumbnail slider</a></li>
3233
<li class="active"><a href="basic-carousel.html">Basic Carousel</a></li>

‎demo/basic-slider-with-custom-direction-nav.html‎

Lines changed: 183 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,183 @@
1+
<!DOCTYPE html>
2+
<html class="no-js" lang="en">
3+
<head>
4+
<meta content="charset=utf-8">
5+
<title>FlexSlider 2</title>
6+
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
7+
8+
<!-- Demo CSS -->
9+
<link rel="stylesheet" href="css/demo.css" type="text/css" media="screen" />
10+
<link rel="stylesheet" href="../flexslider.css" type="text/css" media="screen" />
11+
12+
<!-- Modernizr -->
13+
<script src="js/modernizr.js"></script>
14+
15+
<style>
16+
.flexslider {
17+
margin-bottom: 10px;
18+
}
19+
20+
.flex-control-nav {
21+
position: relative;
22+
bottom: auto;
23+
}
24+
25+
.custom-navigation {
26+
display: table;
27+
width: 100%;
28+
table-layout: fixed;
29+
}
30+
31+
.custom-navigation > * {
32+
display: table-cell;
33+
}
34+
35+
.custom-navigation > a {
36+
width: 50px;
37+
}
38+
39+
.custom-navigation .flex-next {
40+
text-align: right;
41+
}
42+
</style>
43+
44+
</head>
45+
<body class="loading">
46+
47+
<div id="container" class="cf">
48+
<header role="navigation">
49+
<a class="logo" href="http://www.woothemes.com" title="WooThemes">
50+
<img src="images/logo.png" alt="WooThemes" />
51+
</a>
52+
<h1>FlexSlider 2</h1>
53+
<h2>The best responsive slider. Period.</h2>
54+
<a class="button green" href="https://github.com/woothemes/FlexSlider/zipball/master">Download Flexslider</a>
55+
<h3 class="nav-header">Other Examples</h3>
56+
<nav>
57+
<ul>
58+
<li><a href="index.html">Basic Slider</a></li>
59+
<li class="active"><a href="basic-slider-with-custom-direction-nav.html">Basic Slider customDirectionNav</a></li>
60+
<li><a href="thumbnail-controlnav.html">Slider w/thumbnail controlNav pattern</a></li>
61+
<li><a href="thumbnail-slider.html">Slider w/thumbnail slider</a></li>
62+
<li><a href="basic-carousel.html">Basic Carousel</a></li>
63+
<li><a href="carousel-min-max.html">Carousel with min and max ranges</a></li>
64+
<li><a href="dynamic-carousel-min-max.html">Carousel with dynamic min/max ranges</a></li>
65+
<li><a href="video.html">Video & the api (vimeo)</a></li>
66+
<li><a href="video-wistia.html">Video & the api (wistia)</a></li>
67+
</ul>
68+
</nav>
69+
</header>
70+
71+
<div id="main" role="main">
72+
73+
<section class="slider">
74+
<div class="flexslider">
75+
<ul class="slides">
76+
<li>
77+
<img src="images/kitchen_adventurer_cheesecake_brownie.jpg" />
78+
</li>
79+
<li>
80+
<img src="images/kitchen_adventurer_lemon.jpg" />
81+
</li>
82+
<li>
83+
<img src="images/kitchen_adventurer_donut.jpg" />
84+
</li>
85+
<li>
86+
<img src="images/kitchen_adventurer_caramel.jpg" />
87+
</li>
88+
</ul>
89+
</div>
90+
<div class="custom-navigation">
91+
<a href="#" class="flex-prev">Prev</a>
92+
<div class="custom-controls-container"></div>
93+
<a href="#" class="flex-next">Next</a>
94+
</div>
95+
</section>
96+
97+
<aside>
98+
<div class="cf">
99+
<h3>Basic Slider</h3>
100+
<ul class="toggle cf">
101+
<li class="js"><a href="#view-js">JS</a></li>
102+
<li class="html"><a href="#view-html">HTML</a></li>
103+
</ul>
104+
</div>
105+
<div id="view-js" class="code">
106+
<pre class="brush: js; toolbar: false; gutter: false;">
107+
// Can also be used with $(document).ready()
108+
$(window).load(function() {
109+
$('.flexslider').flexslider({
110+
animation: "slide",
111+
controlsContainer: $(".custom-controls-container"),
112+
customDirectionNav: $(".custom-navigation a")
113+
});
114+
});
115+
</pre>
116+
</div>
117+
<div id="view-html" class="code">
118+
<pre class="brush: xml; toolbar: false; gutter: false;">
119+
&lt;!-- Place somewhere in the &lt;body&gt; of your page -->
120+
&lt;div class="flexslider">
121+
&lt;ul class="slides">
122+
&lt;li>
123+
&lt;img src="slide1.jpg" />
124+
&lt;/li>
125+
&lt;li>
126+
&lt;img src="slide2.jpg" />
127+
&lt;/li>
128+
&lt;li>
129+
&lt;img src="slide3.jpg" />
130+
&lt;/li>
131+
&lt;li>
132+
&lt;img src="slide4.jpg" />
133+
&lt;/li>
134+
&lt;/ul>
135+
&lt;/div>
136+
&lt;div class="custom-navigation">
137+
&lt;a href="#" class="flex-prev">Prev&lt;/a>
138+
&lt;div class="custom-controls-container">&lt;/div>
139+
&lt;a href="#" class="flex-next">Next&lt;/a>
140+
&lt;/div>
141+
</pre>
142+
</div>
143+
</aside>
144+
</div>
145+
146+
</div>
147+
148+
<!-- jQuery -->
149+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
150+
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.min.js">\x3C/script>')</script>
151+
152+
<!-- FlexSlider -->
153+
<script defer src="../jquery.flexslider.js"></script>
154+
155+
<script type="text/javascript">
156+
$(function(){
157+
SyntaxHighlighter.all();
158+
});
159+
$(window).load(function(){
160+
$('.flexslider').flexslider({
161+
animation: "slide",
162+
controlsContainer: $(".custom-controls-container"),
163+
customDirectionNav: $(".custom-navigation a"),
164+
start: function(slider){
165+
$('body').removeClass('loading');
166+
}
167+
});
168+
});
169+
</script>
170+
171+
172+
<!-- Syntax Highlighter -->
173+
<script type="text/javascript" src="js/shCore.js"></script>
174+
<script type="text/javascript" src="js/shBrushXml.js"></script>
175+
<script type="text/javascript" src="js/shBrushJScript.js"></script>
176+
177+
<!-- Optional FlexSlider Additions -->
178+
<script src="js/jquery.easing.js"></script>
179+
<script src="js/jquery.mousewheel.js"></script>
180+
<script defer src="js/demo.js"></script>
181+
182+
</body>
183+
</html>

‎demo/carousel-min-max.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ <h3 class="nav-header">Other Examples</h3>
3030
<nav>
3131
<ul>
3232
<li><a href="index.html">Basic Slider</a></li>
33+
<li><a href="basic-slider-with-custom-direction-nav.html">Basic Slider customDirectionNav</a></li>
3334
<li><a href="thumbnail-controlnav.html">Slider w/thumbnail controlNav pattern</a></li>
3435
<li><a href="thumbnail-slider.html">Slider w/thumbnail slider</a></li>
3536
<li><a href="basic-carousel.html">Basic Carousel</a></li>

‎demo/dynamic-carousel-min-max.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,8 @@ <h2>The best responsive slider. Period.</h2>
2626
<h3 class="header-nav">Other Examples</h3>
2727
<nav>
2828
<ul>
29-
<li><a href="demo">Basic Slider</a></li>
29+
<li><a href="index.html">Basic Slider</a></li>
30+
<li><a href="basic-slider-with-custom-direction-nav.html">Basic Slider customDirectionNav</a></li>
3031
<li><a href="thumbnail-controlnav.html">Slider w/thumbnail controlNav pattern</a></li>
3132
<li><a href="thumbnail-slider.html">Slider w/thumbnail slider</a></li>
3233
<li><a href="basic-carousel.html">Basic Carousel</a></li>

‎demo/index.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,8 @@ <h2>The best responsive slider. Period.</h2>
2626
<h3 class="nav-header">Other Examples</h3>
2727
<nav>
2828
<ul>
29-
<li class="active"><a href="demo">Basic Slider</a></li>
29+
<li class="active"><a href="index.html">Basic Slider</a></li>
30+
<li><a href="basic-slider-with-custom-direction-nav.html">Basic Slider customDirectionNav</a></li>
3031
<li><a href="thumbnail-controlnav.html">Slider w/thumbnail controlNav pattern</a></li>
3132
<li><a href="thumbnail-slider.html">Slider w/thumbnail slider</a></li>
3233
<li><a href="basic-carousel.html">Basic Carousel</a></li>

‎demo/thumbnail-controlnav.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ <h3 class="nav-header">Other Examples</h3>
2727
<nav>
2828
<ul>
2929
<li><a href="index.html">Basic Slider</a></li>
30+
<li><a href="basic-slider-with-custom-direction-nav.html">Basic Slider customDirectionNav</a></li>
3031
<li class="active"><a href="thumbnail-controlnav.html">Slider w/thumbnail controlNav pattern</a></li>
3132
<li><a href="thumbnail-slider.html">Slider w/thumbnail slider</a></li>
3233
<li><a href="basic-carousel.html">Basic Carousel</a></li>

‎demo/thumbnail-slider.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ <h3 class="nav-header">Other Examples</h3>
2727
<nav>
2828
<ul>
2929
<li><a href="index.html">Basic Slider</a></li>
30+
<li><a href="basic-slider-with-custom-direction-nav.html">Basic Slider customDirectionNav</a></li>
3031
<li><a href="thumbnail-controlnav.html">Slider w/thumbnail controlNav pattern</a></li>
3132
<li class="active"><a href="thumbnail-slider.html">Slider w/thumbnail slider</a></li>
3233
<li><a href="basic-carousel.html">Basic Carousel</a></li>

0 commit comments

Comments
 (0)