diff --git a/scrollimate.js b/scrollimate.js index 892361e..8db965b 100644 --- a/scrollimate.js +++ b/scrollimate.js @@ -518,36 +518,57 @@ var scrollimate = (function( window, $ ){ var inttype = 'click'; var noclass = false; } - - $('').appendTo($('head')); + + $('').appendTo($('head')); if(!noclass){ $target.addClass('ripplestyles'); + } + + var _execute = function(event, passedthis){ + var $div = $('
'), + btnOffset = $(passedthis).offset(), + xPos = event.pageX - btnOffset.left, + yPos = event.pageY - btnOffset.top; + + $div.addClass('ripple-effect'); + var $ripple = $(".ripple-effect"); + + $ripple.css("height", $(passedthis).height()); + $ripple.css("width", $(passedthis).height()); + var color = $(passedthis).data("ripplecolor") || fallbackcolor; + $div.css({ + top: yPos - ($ripple.height()/2), + left: xPos - ($ripple.width()/2), + background: color + }).appendTo($(passedthis)); + + window.setTimeout(function(){ + $div.remove(); + }, 1500); + } + + var reseter = false; + if(inttype === 'mouseover'){ + $target.on(inttype, function (event) { + if(reseter === true){ + _execute(event, this); + reseter = false; + } + }); + + $target.on('mouseout', function(){ + reseter = true; + }); + } + else{ + $target.on(inttype, function (event) { + _execute(event, this); + }); } - $target.on(inttype, function (event) { - - var $div = $('
'), - btnOffset = $(this).offset(), - xPos = event.pageX - btnOffset.left, - yPos = event.pageY - btnOffset.top; - - $div.addClass('ripple-effect'); - var $ripple = $(".ripple-effect"); - - $ripple.css("height", $(this).height()); - $ripple.css("width", $(this).height()); - var color = $(this).data("ripplecolor") || fallbackcolor; - $div.css({ - top: yPos - ($ripple.height()/2), - left: xPos - ($ripple.width()/2), - background: color - }).appendTo($(this)); - - window.setTimeout(function(){ - $div.remove(); - }, 1500); - }); + + };