Add hover handlers for ie6.

Use scripts to add '.hover' class on the `.ps-container` and both
scrollbars when then mouse is over them because :hover is not supported
except 'a' element.
This commit is contained in:
maoziliang 2013-06-11 23:44:36 +08:00 committed by Hyunje Alex Jun
parent e93d67e754
commit a52d55957d
2 changed files with 24 additions and 4 deletions

View File

@ -14,12 +14,14 @@
transition: opacity .2s linear;
}
.ps-container:hover .ps-scrollbar-x {
.ps-container:hover .ps-scrollbar-x,
.ps-container.hover .ps-scrollbar-x {
opacity: 0.6;
filter: alpha(opacity = 60);
}
.ps-container .ps-scrollbar-x:hover {
.ps-container .ps-scrollbar-x:hover,
.ps-container .ps-scrollbar-x.hover {
opacity: 0.9;
filter: alpha(opacity = 90);
cursor:default;
@ -46,12 +48,14 @@
transition: opacity .2s linear;
}
.ps-container:hover .ps-scrollbar-y {
.ps-container:hover .ps-scrollbar-y,
.ps-container.hover .ps-scrollbar-y {
opacity: 0.6;
filter: alpha(opacity = 60);
}
.ps-container .ps-scrollbar-y:hover {
.ps-container .ps-scrollbar-y:hover,
.ps-container .ps-scrollbar-y.hover {
opacity: 0.9;
filter: alpha(opacity = 90);
cursor: default;

View File

@ -309,6 +309,22 @@
var ieSupport = function (version) {
$this.addClass('ie').addClass('ie' + version);
var bindHoverHandlers = function () {
var mouseenter = function () {
$(this).addClass('hover');
};
var mouseleave = function () {
$(this).removeClass('hover');
};
$this.bind('mouseenter.perfect-scroll', mouseenter).bind('mouseleave.perfect-scroll', mouseleave);
$scrollbarX.bind('mouseenter.perfect-scroll', mouseenter).bind('mouseleave.perfect-scroll', mouseleave);
$scrollbarY.bind('mouseenter.perfect-scroll', mouseenter).bind('mouseleave.perfect-scroll', mouseleave);
};
if (version === 6) {
bindHoverHandlers();
}
};
var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent);