Day26 of #100DaysOfCode

#CodeTogether Day 26/100

Project 26: Stripe Follow Along Dropdown

.dropdown {
opacity: 0;
will-change: opacity;
display: none;
.trigger-enter .dropdown {
display: block;
.trigger-enter-active .dropdown {
opacity: 1;
function handleEnter() {
setTimeout(() => this.classList.contains('trigger-enter') && this.classList.add('trigger-enter-active'), 150);
const dropdown = this.querySelector('.dropdown');
const dropdownCoords = dropdown.getBoundingClientRect();
const navCoords = nav.getBoundingClientRect();
const coords = {
height: dropdownCoords.height,
width: dropdownCoords.width,
top: -,
left: dropdownCoords.left - navCoords.left
};'width', `${coords.width}px`);'height', `${coords.height}px`);'transform', `translate(${coords.left}px, ${}px)`);
function handleLeave() {
this.classList.remove('trigger-enter', 'trigger-enter-active');
Follow Along Dropdown

Today I Learned (T-I-L):

That is all for Day26 ✅



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store