Skip to content

Instantly share code, notes, and snippets.

@nowri
Created April 17, 2017 06:26
Show Gist options
  • Save nowri/f5e0923763c2d7fdd0e1fc7f48969384 to your computer and use it in GitHub Desktop.
Save nowri/f5e0923763c2d7fdd0e1fc7f48969384 to your computer and use it in GitHub Desktop.
スマホブラウザでホバーエフェクト。Androidブラウザのtouchend対応
var hoverEffect = function($dom, timerIdList) {
var CLASS_HOVER = "hover",
touthStart = (Modernizr.touch)? "touchstart" : "mouseover",
touthEnd = (Modernizr.touch)? "touchend" : "mouseout",
isAndroid = isMobile.Android();
$dom.each(function(i, el){
$(el).on(touthStart, function(){
var $self = $(this);
$self.addClass(CLASS_HOVER);
// fixed mobile mouseout bug
if(!Modernizr.touch)return;
if(!isAndroid)return;
var timerId = setTimeout(function() {
$self.removeClass(CLASS_HOVER);
}, 600);
if(timerIdList)timerIdList.push(timerId);
}
)
.on(touthEnd, function(e) {
$(this)
.removeClass(CLASS_HOVER);
});
});
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment