This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const math = { | |
map: (x, a, b, c, d) => ((x - a) * (d - c)) / (b - a) + c, | |
lerp: (a, b, n) => (1 - n) * a + n * b | |
}; | |
const { body } = document; | |
// Window | |
let winsize; | |
const calcWinsize = () => { | |
winsize = { width: window.innerWidth, height: window.innerHeight }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Options | |
const options = { | |
threshold: [0, 0.25, 0.5, 0.75, 1] | |
}; | |
const animateItem = item => item.target.classList.add('visible'); | |
// Create observer | |
const observer = new IntersectionObserver(items => { | |
items.forEach(item => { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
console.log(+getComputedStyle(mainImage) | |
.transform.slice(7) | |
.split(',')[0]) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { TweenMax } from 'gsap'; | |
import anime from 'animejs'; | |
window.anime = anime; | |
const get = (el, dir) => { | |
const translate = getComputedStyle(el) | |
.getPropertyValue('transform') | |
.match(/(-?[0-9\.]+)/g); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function snapTranslateXYValsToNearestPixel(element){ | |
var xTransPos = $(element).offset().left; | |
var yTransPos = $(element).offset().top; | |
// turn off any transitions (but save values first): | |
var transitionVal = $(element).css('transition'); | |
$(element).css('transition', 'none'); | |
// turn off translate: | |
$(element).css('transform', 'translateX(0) translateY(0)'); | |
var xPosDiff = xTransPos - $(element).offset().left; | |
var yPosDiff = yTransPos - $(element).offset().top; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const outer = document.createElement('div'); | |
const inner = document.createElement('div'); | |
outer.style.overflow = 'scroll'; | |
document.body.appendChild(outer); | |
outer.appendChild(inner); | |
const scrollbarWidth = outer.offsetWidth - inner.offsetWidth; | |
document.body.removeChild(outer); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@for $i from 1 through 10 | |
.menu__social-item:nth-child(#{$i}) | |
transition-delay:(#{$i*0.15s}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
=margin($side: bottom, $color: darkBlue) | |
// lvl 5 - darkBlue | |
@if $color == darkBlue | |
margin-#{$side}: 64px | |
@media (max-width: 1920px) | |
margin-#{$side}: 40px | |
@media (max-width: 1440px) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$.fn.isInViewport = function() { | |
const elementTop = $(this).offset().top; | |
const elementBottom = elementTop + $(this).outerHeight(); | |
const viewportTop = $(window).scrollTop(); | |
const viewportBottom = viewportTop + $(window).height(); | |
return elementBottom > viewportTop && elementTop < viewportBottom; | |
}; |