')
+ .addClass('nice-select')
+ .addClass(el.attr('class') || '')
+ .addClass(el.attr('disabled') ? 'disabled' : '')
+ .attr('tabindex', el.attr('disabled') ? null : '0')
+ .html('
')
+ );
+
+ var $dropdown = el.next();
+ var $options = el.find('option');
+ var $selected = el.find('option:selected');
+
+ $dropdown.find('.current').html($selected.data('display') || $selected.text());
+
+ $options.each(function () {
+ var $option = $(this);
+ var display = $option.data('display');
+
+ $dropdown.find('ul').append(
+ $('
')
+ .attr('data-value', $option.val())
+ .attr('data-display', (display || null))
+ .addClass('option' +
+ ($option.is(':selected') ? ' selected' : '') +
+ ($option.is(':disabled') ? ' disabled' : ''))
+ .html($option.text())
+ );
+ });
+ },
+ update: function (el) {
+ el.each(function() {
+ var $select = $(this);
+ var $dropdown = $(this).next('.nice-select');
+ var open = $dropdown.hasClass('open');
+
+ if ($dropdown.length) {
+ $dropdown.remove();
+ niceSelect['create']($select);
+
+ if (open) {
+ $select.next().trigger('click');
+ }
+ }
+ });
+ },
+ destroy: function (el) {
+ el.each(function() {
+ var $select = $(this);
+ var $dropdown = $(this).next('.nice-select');
+
+ if ($dropdown.length) {
+ $dropdown.remove();
+ $select.css('display', '');
+ }
+ });
+
+ if ($('.nice-select').length === 0) {
+ $(document).off('.nice_select');
}
- }
- });
- } else if (method == 'destroy') {
- this.each(function() {
- var $select = $(this);
- var $dropdown = $(this).next('.nice-select');
-
- if ($dropdown.length) {
- $dropdown.remove();
- $select.css('display', '');
- }
- });
- if ($('.nice-select').length == 0) {
- $(document).off('.nice_select');
}
- } else {
- console.log('Method "' + method + '" does not exist.')
- }
- return this;
- }
-
- // Hide native select
- this.hide();
-
- // Create custom markup
- this.each(function() {
- var $select = $(this);
-
- if (!$select.next().hasClass('nice-select')) {
- create_nice_select($select);
- }
- });
-
- function create_nice_select($select) {
- $select.after($('')
- .addClass('nice-select')
- .addClass($select.attr('class') || '')
- .addClass($select.attr('disabled') ? 'disabled' : '')
- .attr('tabindex', $select.attr('disabled') ? null : '0')
- .html('')
- );
-
- var $dropdown = $select.next();
- var $options = $select.find('option');
- var $selected = $select.find('option:selected');
-
- $dropdown.find('.current').html($selected.data('display') || $selected.text());
-
- $options.each(function(i) {
- var $option = $(this);
- var display = $option.data('display');
-
- $dropdown.find('ul').append($('')
- .attr('data-value', $option.val())
- .attr('data-display', (display || null))
- .addClass('option' +
- ($option.is(':selected') ? ' selected' : '') +
- ($option.is(':disabled') ? ' disabled' : ''))
- .html($option.text())
- );
- });
- }
-
- /* Event listeners */
-
- // Unbind existing events in case that the plugin has been initialized before
- $(document).off('.nice_select');
-
- // Open/close
- $(document).on('click.nice_select', '.nice-select', function(event) {
- var $dropdown = $(this);
-
- $('.nice-select').not($dropdown).removeClass('open');
- $dropdown.toggleClass('open');
-
- if ($dropdown.hasClass('open')) {
- $dropdown.find('.option');
- $dropdown.find('.focus').removeClass('focus');
- $dropdown.find('.selected').addClass('focus');
- } else {
- $dropdown.focus();
- }
- });
-
- // Close when clicking outside
- $(document).on('click.nice_select', function(event) {
- if ($(event.target).closest('.nice-select').length === 0) {
- $('.nice-select').removeClass('open').find('.option');
- }
- });
-
- // Option click
- $(document).on('click.nice_select', '.nice-select .option:not(.disabled)', function(event) {
- var $option = $(this);
- var $dropdown = $option.closest('.nice-select');
-
- $dropdown.find('.selected').removeClass('selected');
- $option.addClass('selected');
-
- var text = $option.data('display') || $option.text();
- $dropdown.find('.current').text(text);
-
- $dropdown.prev('select').val($option.data('value')).trigger('change');
});
- // Keyboard events
- $(document).on('keydown.nice_select', '.nice-select', function(event) {
- var $dropdown = $(this);
- var $focused_option = $($dropdown.find('.focus') || $dropdown.find('.list .option.selected'));
-
- // Space or Enter
- if (event.keyCode == 32 || event.keyCode == 13) {
- if ($dropdown.hasClass('open')) {
- $focused_option.trigger('click');
- } else {
- $dropdown.trigger('click');
- }
- return false;
- // Down
- } else if (event.keyCode == 40) {
- if (!$dropdown.hasClass('open')) {
- $dropdown.trigger('click');
- } else {
- var $next = $focused_option.nextAll('.option:not(.disabled)').first();
- if ($next.length > 0) {
- $dropdown.find('.focus').removeClass('focus');
- $next.addClass('focus');
- }
- }
- return false;
- // Up
- } else if (event.keyCode == 38) {
- if (!$dropdown.hasClass('open')) {
- $dropdown.trigger('click');
- } else {
- var $prev = $focused_option.prevAll('.option:not(.disabled)').first();
- if ($prev.length > 0) {
- $dropdown.find('.focus').removeClass('focus');
- $prev.addClass('focus');
- }
- }
- return false;
- // Esc
- } else if (event.keyCode == 27) {
- if ($dropdown.hasClass('open')) {
- $dropdown.trigger('click');
+ // niceSelect Plugin Definition
+
+ function Plugin(method) {
+
+ if (typeof method === 'string') {
+ if (method === 'update') {
+ niceSelect['update'](this);
+ } else if (method === 'destroy') {
+ niceSelect['destroy'](this);
+ } else {
+ console.warning('Method "' + method + '" does not exist.');
+ }
}
- // Tab
- } else if (event.keyCode == 9) {
- if ($dropdown.hasClass('open')) {
- return false;
+
+ // Hide native select
+ this.hide();
+
+ // Create custom markup
+ this.each(function () {
+ var $select = $(this);
+
+ if (!$select.next().hasClass('nice-select')) {
+ niceSelect['create']($select);
+ }
+ });
+
+ /* Event listeners */
+
+ // Unbind existing events in case that the plugin has been initialized before
+ $(document).off('.nice_select');
+
+ // Open/close
+ $(document).on('click.nice_select', '.nice-select', function () {
+ var $dropdown = $(this);
+
+ $('.nice-select').not($dropdown).removeClass('open');
+ $dropdown.toggleClass('open');
+
+ if ($dropdown.hasClass('open')) {
+ $dropdown.find('.option');
+ $dropdown.find('.focus').removeClass('focus');
+ $dropdown.find('.selected').addClass('focus');
+ } else {
+ $dropdown.focus();
+ }
+ });
+
+ // Close when clicking outside
+ $(document).on('click.nice_select', function (event) {
+ if ($(event.target).closest('.nice-select').length === 0) {
+ $('.nice-select').removeClass('open').find('.option');
+ }
+ });
+
+ // Option click
+ $(document).on('click.nice_select', '.nice-select .option:not(.disabled)', function () {
+ var $option = $(this);
+ var $dropdown = $option.closest('.nice-select');
+
+ $dropdown.find('.selected').removeClass('selected');
+ $option.addClass('selected');
+
+ var text = $option.data('display') || $option.text();
+ $dropdown.find('.current').text(text);
+
+ var $select = $dropdown.prev('select');
+ $select.val($option.data('value'));
+
+ var e = document.createEvent('HTMLEvents');
+ e.initEvent('change', true, true);
+ $select[0].dispatchEvent(e);
+ });
+
+ // Keyboard events
+ $(document).on('keydown.nice_select', '.nice-select', function (event) {
+ var $dropdown = $(this);
+ var $focused_option = $($dropdown.find('.focus') || $dropdown.find('.list .option.selected'));
+
+ // Space or Enter
+ if (event.keyCode === 32 || event.keyCode === 13) {
+ if ($dropdown.hasClass('open')) {
+ $focused_option.trigger('click');
+ } else {
+ $dropdown.trigger('click');
+ }
+ return false;
+ // Down
+ } else if (event.keyCode === 40) {
+ if (!$dropdown.hasClass('open')) {
+ $dropdown.trigger('click');
+ } else {
+ var $next = $focused_option.nextAll('.option:not(.disabled)').first();
+ if ($next.length > 0) {
+ $dropdown.find('.focus').removeClass('focus');
+ $next.addClass('focus');
+ }
+ }
+ return false;
+ // Up
+ } else if (event.keyCode === 38) {
+ if (!$dropdown.hasClass('open')) {
+ $dropdown.trigger('click');
+ } else {
+ var $prev = $focused_option.prevAll('.option:not(.disabled)').first();
+ if ($prev.length > 0) {
+ $dropdown.find('.focus').removeClass('focus');
+ $prev.addClass('focus');
+ }
+ }
+ return false;
+ // Esc
+ } else if (event.keyCode === 27) {
+ if ($dropdown.hasClass('open')) {
+ $dropdown.trigger('click');
+ }
+ // Tab
+ } else if (event.keyCode === 9) {
+ if ($dropdown.hasClass('open')) {
+ return false;
+ }
+ }
+ });
+
+ // Detect CSS pointer-events support, for IE <= 10. From Modernizr.
+ var style = document.createElement('a').style;
+ style.cssText = 'pointer-events:auto';
+ if (style.pointerEvents !== 'auto') {
+ $('html').addClass('no-csspointerevents');
}
- }
- });
- // Detect CSS pointer-events support, for IE <= 10. From Modernizr.
- var style = document.createElement('a').style;
- style.cssText = 'pointer-events:auto';
- if (style.pointerEvents !== 'auto') {
- $('html').addClass('no-csspointerevents');
- }
-
- return this;
+ return this;
+ };
+
+ var old = $.fn.niceSelect;
+
+ $.fn.niceSelect = Plugin;
+ $.fn.niceSelect.Constructor = niceSelect;
+
+ // niceSelect No Conflict
- };
+ $.fn.niceSelect.noConflict = function () {
+ $.fn.niceSelect = old;
+ return this;
+ };
-}(jQuery));
\ No newline at end of file
+}(jQuery, window, document));
\ No newline at end of file
diff --git a/js/jquery.nice-select.min.js b/js/jquery.nice-select.min.js
index 88eb2d6..748329d 100644
--- a/js/jquery.nice-select.min.js
+++ b/js/jquery.nice-select.min.js
@@ -1,4 +1,5 @@
-/* jQuery Nice Select - v1.0
+/* jQuery Nice Select - v1.2.0
https://github.com/hernansartorio/jquery-nice-select
- Made by Hernán Sartorio */
-!function(e){e.fn.niceSelect=function(t){function s(t){t.after(e("
").addClass("nice-select").addClass(t.attr("class")||"").addClass(t.attr("disabled")?"disabled":"").attr("tabindex",t.attr("disabled")?null:"0").html('
'));var s=t.next(),n=t.find("option"),i=t.find("option:selected");s.find(".current").html(i.data("display")||i.text()),n.each(function(t){var n=e(this),i=n.data("display");s.find("ul").append(e("
").attr("data-value",n.val()).attr("data-display",i||null).addClass("option"+(n.is(":selected")?" selected":"")+(n.is(":disabled")?" disabled":"")).html(n.text()))})}if("string"==typeof t)return"update"==t?this.each(function(){var t=e(this),n=e(this).next(".nice-select"),i=n.hasClass("open");n.length&&(n.remove(),s(t),i&&t.next().trigger("click"))}):"destroy"==t?(this.each(function(){var t=e(this),s=e(this).next(".nice-select");s.length&&(s.remove(),t.css("display",""))}),0==e(".nice-select").length&&e(document).off(".nice_select")):console.log('Method "'+t+'" does not exist.'),this;this.hide(),this.each(function(){var t=e(this);t.next().hasClass("nice-select")||s(t)}),e(document).off(".nice_select"),e(document).on("click.nice_select",".nice-select",function(t){var s=e(this);e(".nice-select").not(s).removeClass("open"),s.toggleClass("open"),s.hasClass("open")?(s.find(".option"),s.find(".focus").removeClass("focus"),s.find(".selected").addClass("focus")):s.focus()}),e(document).on("click.nice_select",function(t){0===e(t.target).closest(".nice-select").length&&e(".nice-select").removeClass("open").find(".option")}),e(document).on("click.nice_select",".nice-select .option:not(.disabled)",function(t){var s=e(this),n=s.closest(".nice-select");n.find(".selected").removeClass("selected"),s.addClass("selected");var i=s.data("display")||s.text();n.find(".current").text(i),n.prev("select").val(s.data("value")).trigger("change")}),e(document).on("keydown.nice_select",".nice-select",function(t){var s=e(this),n=e(s.find(".focus")||s.find(".list .option.selected"));if(32==t.keyCode||13==t.keyCode)return s.hasClass("open")?n.trigger("click"):s.trigger("click"),!1;if(40==t.keyCode){if(s.hasClass("open")){var i=n.nextAll(".option:not(.disabled)").first();i.length>0&&(s.find(".focus").removeClass("focus"),i.addClass("focus"))}else s.trigger("click");return!1}if(38==t.keyCode){if(s.hasClass("open")){var l=n.prevAll(".option:not(.disabled)").first();l.length>0&&(s.find(".focus").removeClass("focus"),l.addClass("focus"))}else s.trigger("click");return!1}if(27==t.keyCode)s.hasClass("open")&&s.trigger("click");else if(9==t.keyCode&&s.hasClass("open"))return!1});var n=document.createElement("a").style;return n.cssText="pointer-events:auto","auto"!==n.pointerEvents&&e("html").addClass("no-csspointerevents"),this}}(jQuery);
\ No newline at end of file
+ Made by Hernán Sartorio
+ Modified by Arsen Bespalov */
+!function(e,t,s,n){function i(){}function c(t){"string"==typeof t&&("update"===t?i.update(this):"destroy"===t?i.destroy(this):console.warning('Method "'+t+'" does not exist.')),this.hide(),this.each(function(){var t=e(this);t.next().hasClass("nice-select")||i.create(t)}),e(s).off(".nice_select"),e(s).on("click.nice_select",".nice-select",function(){var t=e(this);e(".nice-select").not(t).removeClass("open"),t.toggleClass("open"),t.hasClass("open")?(t.find(".option"),t.find(".focus").removeClass("focus"),t.find(".selected").addClass("focus")):t.focus()}),e(s).on("click.nice_select",function(t){0===e(t.target).closest(".nice-select").length&&e(".nice-select").removeClass("open").find(".option")}),e(s).on("click.nice_select",".nice-select .option:not(.disabled)",function(){var t=e(this),n=t.closest(".nice-select");n.find(".selected").removeClass("selected"),t.addClass("selected");var i=t.data("display")||t.text();n.find(".current").text(i);var c=n.prev("select");c.val(t.data("value"));var l=s.createEvent("HTMLEvents");l.initEvent("change",!0,!0),c[0].dispatchEvent(l)}),e(s).on("keydown.nice_select",".nice-select",function(t){var s=e(this),n=e(s.find(".focus")||s.find(".list .option.selected"));if(32===t.keyCode||13===t.keyCode)return s.hasClass("open")?n.trigger("click"):s.trigger("click"),!1;if(40===t.keyCode){if(s.hasClass("open")){var i=n.nextAll(".option:not(.disabled)").first();i.length>0&&(s.find(".focus").removeClass("focus"),i.addClass("focus"))}else s.trigger("click");return!1}if(38===t.keyCode){if(s.hasClass("open")){var c=n.prevAll(".option:not(.disabled)").first();c.length>0&&(s.find(".focus").removeClass("focus"),c.addClass("focus"))}else s.trigger("click");return!1}if(27===t.keyCode)s.hasClass("open")&&s.trigger("click");else if(9===t.keyCode&&s.hasClass("open"))return!1});var n=s.createElement("a").style;return n.cssText="pointer-events:auto","auto"!==n.pointerEvents&&e("html").addClass("no-csspointerevents"),this}e.extend(i,{create:function(t){t.after(e("
").addClass("nice-select").addClass(t.attr("class")||"").addClass(t.attr("disabled")?"disabled":"").attr("tabindex",t.attr("disabled")?null:"0").html('
'));var s=t.next(),n=t.find("option"),i=t.find("option:selected");s.find(".current").html(i.data("display")||i.text()),n.each(function(){var t=e(this),n=t.data("display");s.find("ul").append(e("
").attr("data-value",t.val()).attr("data-display",n||null).addClass("option"+(t.is(":selected")?" selected":"")+(t.is(":disabled")?" disabled":"")).html(t.text()))})},update:function(t){t.each(function(){var t=e(this),s=e(this).next(".nice-select"),n=s.hasClass("open");s.length&&(s.remove(),i.create(t),n&&t.next().trigger("click"))})},destroy:function(t){t.each(function(){var t=e(this),s=e(this).next(".nice-select");s.length&&(s.remove(),t.css("display",""))}),0===e(".nice-select").length&&e(s).off(".nice_select")}});var l=e.fn.niceSelect;e.fn.niceSelect=c,e.fn.niceSelect.Constructor=i,e.fn.niceSelect.noConflict=function(){return e.fn.niceSelect=l,this}}(jQuery,window,document);
\ No newline at end of file
diff --git a/package.json b/package.json
index c139d9c..dc0a5a1 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "jquery-nice-select",
- "version": "1.1.0",
+ "version": "1.2.0",
"description": "A lightweight jQuery plugin that replaces native select elements with customizable dropdowns.",
"main": "./js/jquery.nice-select.min.js",
"dependencies": {
diff --git a/scss/_nice-select-prefixed.scss b/scss/_nice-select-prefixed.scss
index ca3c3e7..128ce19 100644
--- a/scss/_nice-select-prefixed.scss
+++ b/scss/_nice-select-prefixed.scss
@@ -35,8 +35,6 @@ $arrow_color: $gray !default;
padding-right: $dropdown_padding + 12;
position: relative;
text-align: left !important;
- -webkit-transition
-: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
-webkit-user-select: none;
-moz-user-select: none;
@@ -68,8 +66,6 @@ $arrow_color: $gray !default;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
- -webkit-transition
-: all 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
width: 5px;
}
@@ -146,8 +142,6 @@ $arrow_color: $gray !default;
-webkit-transform: scale(.75) translateY(- $input_height / 2);
-ms-transform: scale(.75) translateY(- $input_height / 2);
transform: scale(.75) translateY(- $input_height / 2);
- -webkit-transition
-: all .2s cubic-bezier(0.5, 0, 0, 1.25), opacity .15s ease-out;
transition: all .2s cubic-bezier(0.5, 0, 0, 1.25), opacity .15s ease-out;
z-index: 9;
&:hover .option:not(:hover) {
@@ -164,8 +158,6 @@ $arrow_color: $gray !default;
padding-left: $dropdown_padding;
padding-right: $dropdown_padding + 11;
text-align: left;
- -webkit-transition
-: all 0.2s;
transition: all 0.2s;
&:hover, &.focus, &.selected.focus {
background-color: $gray_lighter;