Commit 0c784013 authored by Rafal Zajac's avatar Rafal Zajac
parents 613bc500 041f5ea6
......@@ -7,6 +7,7 @@ Slider directive implementation for AngularJS, without any dependencies.
- Well documented
- Customizable
- Simple to use
- Compatibility with jQuery Lite, ie. with full jQuery ( Thanks Jusas! https://github.com/Jusas)
## Examples
......@@ -140,19 +141,17 @@ You can also force redraw with **rzSliderForceRender** event.
## Changelog
**v0.0.1**
**v0.1.3**
Original rewrite to JavaScript
Forked from this version.
**v0.1.0**
**v0.1.4**
Bug fixes
Performance improvements
Reduce number of angular bindings
Reduce number of function calls in event handlers
Avoid recalculate style
Hit 60fps
LESS variables for easier slider color customization
Touch events were broken if jQuery was used with Angular instead of jQuery lite. This version fixes them (Jusas).
**v0.1.5**
Added 'slideEnded' event emitted on slider knob dragging ended (Jusas).
## Disclaimer
......
{
"name": "angularjs-slider",
"version": "0.1.3",
"version": "0.1.5",
"homepage": "https://github.com/rzajac/angularjs-slider",
"authors": [
"Rafal Zajac <rzajac@gmail.com>"
"Rafal Zajac <rzajac@gmail.com>",
"Jussi Saarivirta <jusasi@gmail.com>"
],
"description": "AngularJS slider directive with no external dependencies. Mobile friendly!",
"main": "rzslider.js",
......
/*! angularjs-slider - v0.1.3 - (c) Rafal Zajac <rzajac@gmail.com>, https://github.com/rzajac/angularjs-slider.git - 2014-03-08 */
/*! jusas-angularjs-slider - v0.1.5 - (c) Rafal Zajac <rzajac@gmail.com>, Jussi Saarivirta <jusasi@gmail.com>, https://github.com/rzajac/angularjs-slider.git - 2014-06-10 */
rzslider{position:relative;display:inline-block;width:100%;height:2px;margin:30px 0 15px 0;vertical-align:middle}rzslider span{position:absolute;display:inline-block;white-space:nowrap}rzslider span.base{width:100%;height:100%;padding:0}rzslider span.bar{z-index:0;width:100%;height:100%;background:#fff}rzslider span.bar.selection{z-index:1;width:0;background:#67b700}rzslider span.pointer{top:-15px;z-index:2;width:32px;height:32px;cursor:pointer;background-color:#fff;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}rzslider span.pointer:after{position:absolute;top:12px;left:12px;width:8px;height:8px;background:#71818e;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;content:''}rzslider span.pointer:hover:after{background-color:#67b700}rzslider span.pointer.active:after{background-color:#67b700}rzslider span.bubble{top:-32px;padding:1px 3px 1px 3px;color:#67b700;cursor:default}rzslider span.bubble.selection{top:15px}rzslider span.bubble.limit{color:#67b700}
\ No newline at end of file
This diff is collapsed.
{
"name": "angularjs-slider",
"version": "0.1.3",
"name": "jusas-angularjs-slider",
"version": "0.1.5",
"description": "AngularJS slider directive with no external dependencies. Mobile friendly!.",
"main": "rzslider.js",
"repository": {
......@@ -18,7 +18,7 @@
"grunt-recess": "~0.4.0",
"recess": "~1.1.9"
},
"author": "Rafal Zajac <rzajac@gmail.com>",
"author": "Rafal Zajac <rzajac@gmail.com>, Jussi Saarivirta <jusasi@gmail.com>",
"license": "MIT",
"readmeFilename": "README.md"
}
......@@ -782,7 +782,7 @@ function throttle(func, wait, options) {
pointer.addClass('active');
if(event.touches)
if(event.touches || (typeof(event.originalEvent) != 'undefined' && event.originalEvent.touches))
{
$document.on('touchmove', angular.bind(this, this.onMove, pointer));
$document.on('touchend', angular.bind(this, this.onEnd));
......@@ -803,7 +803,7 @@ function throttle(func, wait, options) {
*/
onMove: function (pointer, event)
{
var eventX = event.clientX || event.touches[0].clientX,
var eventX = event.clientX || (typeof(event.originalEvent) != 'undefined' ? event.originalEvent.touches[0].clientX : event.touches[0].clientX),
sliderLO = this.sliderElem.rzsl,
newOffset = eventX - sliderLO - this.handleHalfWidth,
newValue;
......@@ -874,7 +874,7 @@ function throttle(func, wait, options) {
this.minH.removeClass('active');
this.maxH.removeClass('active');
if(event.touches)
if(event.touches || (typeof(event.originalEvent) != 'undefined' && event.originalEvent.touches))
{
$document.unbind('touchmove');
$document.unbind('touchend');
......@@ -885,6 +885,8 @@ function throttle(func, wait, options) {
$document.unbind('mouseup');
}
this.scope.$emit('slideEnded');
this.tracking = '';
}
};
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment