Skip to content

Commit

Permalink
tweak how mask is created to remove jitter. fixes #1574
Browse files Browse the repository at this point in the history
  • Loading branch information
ivaynberg committed Aug 1, 2013
1 parent d479018 commit e162a48
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 27 deletions.
19 changes: 6 additions & 13 deletions select2.css
Expand Up @@ -114,25 +114,18 @@ Version: @@ver@@ Timestamp: @@timestamp@@
cursor: pointer;
}

.select2-drop-undermask {
border: 0;
margin: 0;
padding: 0;
position: absolute;
left: 0;
top: 0;
z-index: 9998;
background-color: transparent;
filter: alpha(opacity=0);
}

.select2-drop-mask {
border: 0;
margin: 0;
padding: 0;
position: absolute;
position: fixed;
left: 0;
top: 0;
min-height: 100%;
min-width: 100%;
height: auto;
width: auto;
opacity: 0;
z-index: 9998;
/* styles required for IE to work */
background-color: #fff;
Expand Down
24 changes: 10 additions & 14 deletions select2.js
Expand Up @@ -1262,7 +1262,7 @@ the specific language governing permissions and limitations under the Apache Lic
if (self.opts.selectOnBlur) {
self.selectHighlighted({noFocus: true});
}
self.close();
self.close({focus:false});

This comment has been minimized.

Copy link
@tpruvot

tpruvot Oct 8, 2013

Contributor

Hello, im using select2 and bootstrap which make a boxshadow on focused fields.

Since this commit the focus is no more reset when i switch to another field.

removing focus:false fix it for the mouse, but not using the TAB key

This comment has been minimized.

Copy link
@tpruvot

tpruvot Oct 8, 2013

Contributor

select2-container-active class is left on focus lost

e.preventDefault();
e.stopPropagation();
}
Expand All @@ -1279,9 +1279,7 @@ the specific language governing permissions and limitations under the Apache Lic
this.dropdown.attr("id", "select2-drop");

// show the elements
maskCss=_makeMaskCss();

mask.css(maskCss).show();
mask.show();

this.dropdown.show();
this.positionDropdown();
Expand All @@ -1293,18 +1291,11 @@ the specific language governing permissions and limitations under the Apache Lic
var that = this;
this.container.parents().add(window).each(function () {
$(this).on(resize+" "+scroll+" "+orient, function (e) {
var maskCss=_makeMaskCss();
$("#select2-drop-mask").css(maskCss);
that.positionDropdown();
});
});

function _makeMaskCss() {
return {
width : Math.max(document.documentElement.scrollWidth, $(window).width()),
height : Math.max(document.documentElement.scrollHeight, $(window).height())
}
}

},

// abstract
Expand Down Expand Up @@ -1835,11 +1826,16 @@ the specific language governing permissions and limitations under the Apache Lic
},

// single
close: function () {
close: function (params) {
if (!this.opened()) return;
this.parent.close.apply(this, arguments);

params = params || {focus: true};
this.focusser.removeAttr("disabled");
this.focusser.focus();

if (params.focus) {
this.focusser.focus();
}
},

// single
Expand Down

2 comments on commit e162a48

@tpruvot
Copy link
Contributor

@tpruvot tpruvot commented on e162a48 Oct 8, 2013

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

around line 1950 this.search.focus(); is called later when hitting the TAB from window.setTimeout

which cause the addClass("select2-container-active")

@tpruvot
Copy link
Contributor

@tpruvot tpruvot commented on e162a48 Oct 8, 2013

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

see #1778

Please sign in to comment.