titans,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body> <div>Только нужно, что бы эффект волны срабатывал при наведении мышки.</div>
<script>
var jump = [-1, -2, -5, -9, -13, -9, -5, -2, 1],
div = $("div"),
mess = div.html(),
timer;
div.mouseenter(function () {
div.html("");
$.each(mess.split(""), function () {
$("<span/>", {
"class": "wave",
text: this
}).appendTo(div)
});
var a = $(".wave"),
b = $(".wave").size(),
e = 0;
a.css({
position: "relative"
});
(function () {
var c = e++ % b;
d = 0;
a.each(function (a, b) {
$(b).css({
top: a < c ? 0 : a > c + 8 ? 0 : jump[d++] + "px"
})
});
timer = setTimeout(arguments.callee, 50)
})()
});
div.mouseleave(function () {
window.clearTimeout(timer);
div.html(mess)
});
</script>
</body>
</html>
