Как сделать так, чтобы созданная на CSS/JQ «волна» ограничивалась бы размерами кнопки?

Question

[Алексей Смирнов]

Здравствуйте.

Есть некоторый код, который создает анимацию "волны" при щелчке мышью на кнопку "Button":
jsfiddle.net/0hLjn2es/3/
И этот код работает хорошо, за исключением того, что волны выходят за пределы границ кнопки Button. А мне необходимо чтобы волны завершались бы на границах этой кнопки.

Как сделать так, чтобы возникающая "волна" ограничивалась бы размерами кнопки "Button" (то есть не выходила бы за её пределы) ?

Answer 1

[Ксения Михайлова]

position: relative;
overflow: hidden;

для a
Только учтите, что после этой правки абсолютная позиция расширяющегося круга будет рассчитываться относительно кнопки.

Comments

[Алексей Смирнов]

Точно, я про "overflow: hidden;" не подумал. Спасибо)