Open Kurniawandering opened 9 years ago
@Kurniawandering To center the ripple. This has to be achieved alongside the styling in site.css
.
// site.js
// PART 1 - To position the ripple.
var bounds = link.getBoundingClientRect();
effectNode.style.left = bounds.left + bounds.width / 2 + 'px';
effectNode.style.top = bounds.top + bounds.height / 2 + 'px';
/* site.css */
/* PART 2 - Reposition the ripple so that the ripple appears from the center of the anchor tag. */
div.circleEffect: {
...
margin-left: -120vw;
margin-top: -120vw;
...
}
Hi guys,
Really appreciate the effort for creating this tutorial. I wish you could add more thorough explanations on the how-and-why some decisions are made.
I think that it would be very useful if you add some comments on every code snippet one has to add to follow the tutorial.
for example to explain this added styling:
That would be great! Otherwise, I will also be happy to contribute...
Thanx!