Floating Action Button with Menu Ink Ripple Effect does not stay within button boundaries. about propeller HOT 2 CLOSED

Thank you for bringing this to our notice. Ideally ripple effect should not be there in the FAB button but somehow it remained in our code.

We are sorry for that. Please remove "pmd-ripple-effect" class from the button code.

Still if you need the ripple effect in your button element, here is the fix:

$(".pmd-floating-action-btn.pmd-ripple-effect").on('mousedown touchstart', function() {
    $(this).css('overflow', 'hidden');
    setTimeout(function(){ 
        $(".pmd-floating-action-btn.pmd-ripple-effect").removeAttr("style");
    }, 500);
})

Add above function in your template.

Hope this will help.

from propeller.

I actually like the ripple effect in the Floating Action Button (FAB). However, the mouse location is not used as starting point in some cases.

See GIF: https://i.imgur.com/cLwD61t.gifv

Do you still recommend not using the ripple effect on FAB buttons?

from propeller.