波纹效果仅在打开时起作用,在打开时不起作用

时间:2019-04-19 04:00:25

标签: javascript jquery

对不起,标题令人困惑。

所以我有一个波纹效果的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);

涟漪效应确实适用于禁用的按钮,并且这些按钮无处不在,但似乎仅在调用表单并且尚未填写必填字段时才起作用。

0 个答案:

没有答案