<!-- BTN06 - Модификация для Тильды. Подсветка фона у кнопки https://mod.tistols.com/button-backlight -->
<style>
.btn-flash {
position: absolute;
cursor:pointer;
}
.btn-flash .tn-atom {
overflow: hidden;
position: relative;
z-index: 1!important;
}
.btn-flash .tn-atom:before {
--size: 0;
content: '';
position: absolute;
left: var(--before-x);
top: var(--before-y);
width: var(--size);
height: var(--size);
background: radial-gradient(circle closest-side, #625FFF, transparent);
border-radius: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: width 0.2s ease, height 0.2s ease;
transition: width 0.2s ease, height 0.2s ease;
z-index: -1;
}
.btn-flash:hover .tn-atom:before {
--size: 400px;
}
</style>
<script>
$(document).ready(function () {
$('.btn-flash .tn-atom').on('mousemove', function (e) {
var $this = $(this),
btnOffset = $this.parent().offset(),
xPos = parseInt(e.pageX - btnOffset.left),
yPos = parseInt(e.pageY - btnOffset.top);
$this.css('--x', xPos + 'px');
$this.css('--y', yPos + 'px');
var beforeElement = $this[0].style;
beforeElement.setProperty('--before-x', xPos + 'px');
beforeElement.setProperty('--before-y', yPos + 'px');
});
});
</script>