对不起,标题令人困惑。
所以我有一个波纹效果的javascript可以工作。我有一个表单按钮,但是如果不填写表单,则不会触发波纹效果。但是一旦填写完毕,它就会。
如何更改此代码,以便即使未填写表单,也可以单击按钮查看波纹效果。
(function($) {
$(".ripple-effect").click(function(e) {
var rippler = $(this);
// create .ink element if it doesn't exist
if (rippler.find(".ink").length == 0) {
rippler.append("<span class='ink'></span>");
}
var ink = rippler.find(".ink");
// prevent quick double clicks
ink.removeClass("animate");
// set .ink diametr
if (!ink.height() && !ink.width()) {
var d = Math.max(rippler.outerWidth(), rippler.outerHeight());
ink.css({
height: d,
width: d
});
}
// get click coordinates
var x = e.pageX - rippler.offset().left - ink.width() / 2;
var y = e.pageY - rippler.offset().top - ink.height() / 2;
// set .ink position and add class .animate
ink.css({
top: y + 'px',
left: x + 'px'
}).addClass("animate");
})
})(jQuery);
涟漪效应确实适用于禁用的按钮,并且这些按钮无处不在,但似乎仅在调用表单并且尚未填写必填字段时才起作用。