CSS zoom breaks effect origin point #214
Description
Setting the CSS zoom property on a container to anything other than 1 causes the origin point of the effect to stop matching the point at which the element was clicked. It looks like this:
A tiny demo page that reproduces the issue:
<!DOCTYPE html>
<html>
<head>
<title>Broken waves demo</title>
<link rel="stylesheet" href="waves/waves.min.css" />
</head>
<body style="zoom: 3;">
<button class="waves-effect">Broken waves</button>
<script src="waves/waves.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', ev => {
Waves.init();
});
</script>
</body>
</html>Love the library!