jeangontijo

window.addEventListener("scroll", function (event) {
    var scroll = this.scrollY;
    if(scroll > 0){
        document.querySelector('nav').classList.add('scroll');
    } else {
        document.querySelector('nav').classList.remove('scroll');
    }
});

jeangontijo

var visible = document.querySelectorAll('.element');

function isInViewport(el) {
  var rect = el.getBoundingClientRect();
  return (
      // when any part of element is visible
      rect.top >= -el.clientHeight &&
      rect.left >= -el.clientWidth &&
      rect.bottom <= window.innerHeight + el.clientHeight &&
      rect.right <= window.innerWidth + el.clientWidth

jeangontijo

document.addEventListener("mousemove", function (event) {
  const x = event.pageX
  const y = event.pageY
 
  document.querySelectorAll("div").forEach(div => {
		const dx = (div.offsetLeft + 50) - x
    const dy = (div.offsetTop + 50) - y
    const dist = Math.sqrt(dx * dx + dy * dy)
    
    const score = Math.exp(dist * -0.003)

jeangontijo

// HTML
// <div class="container">
//   <img src="https://picsum.photos/1920/1079" alt="">
//   <img src="https://picsum.photos/1920/1081" alt="">
//   <img src="https://picsum.photos/1921/1081" alt="">
//   <img src="https://picsum.photos/1922/1081" alt="">
// </div>

// SCSS
// .container {

jeangontijo

var nav = document.querySelector('.nav__toggle');
var toggleState = function (elem, one, two) {
  var elem = document.querySelector(elem);
  elem.setAttribute('data-state', elem.getAttribute('data-state') === one ? two : one);
};

nav.onclick = function (e) {
  toggleState('.nav ul', 'closed', 'open');
  e.preventDefault();
};

jeangontijo

.floating-label {
  position:  relative; 
  margin-bottom:  10px; 
  label {
    position:  absolute; 
    top: calc(50% - 7px);
    left:  0; 
    opacity:  0; 
    transition:  all .3s ease; 
  }

jeangontijo

var ww;
var wh;
var setViewport = function () {
  ww = window.innerWidth || document.documentElement.clientWidth;
  wh = window.innerHeight || document.documentElement.clientHeight;
}
setViewport();

window.addEventListener('resize', function () {
	setViewport();

jeangontijo

var interval = setInterval(function() {
    if(document.readyState === 'complete') {
        document.body.classList.remove('load'); 
        clearInterval(interval);
    }    
}, 100);

jeangontijo

var slider = document.getElementById("hero");
var classes = ['slide1', 'slide2', 'slide3', 'slide4'];

var myInterval = setInterval(function () {
    changeClass()
}, 5000);

var i = 0;

function changeClass() {

jeangontijo

// Replace :hover for .hover

var card = document.querySelectorAll('.card');
Array.prototype.slice.call(card).forEach(function(item) {
    item.addEventListener('touchstart', function(e) {
        this.classList.toggle("hover");
    }, false);
    item.addEventListener('mouseenter', function(e) {
        this.classList.add("hover");
    }, false);