JSFiddle - React, Tailwind, and code Playground

by mtenschert

JavaScript

$(document).ready(function() {
  // hides element, moves it 10em down, waits 2 seconds and animates back into place
  var animatePersonDiv = function() {
    $( "div#ski-hire__person-menu" ).css( "transition", "0" );
    $( "div#ski-hire__person-menu" ).css( "margin-top", "10em" );
    $( "div#ski-hire__person-menu" ).css( "opacity", "0" );
    setTimeout(function() {
      $( "div#ski-hire__person-menu" ).css( "transition", "1.5s" );
      $( "div#ski-hire__person-menu" ).css( "margin-top", "" );
      $( "div#ski-hire__person-menu" ).css( "opacity", "1" );
      console.log('remove css');
    }, 1000);
  };
  
  var personDiv = $( "div#ski-hire__person-menu" );
  if (personDiv.length) { // div is already on page!
    animatePersonDiv();
  } else { // div is not on page yet but will be loaded shortly

$(document).on('DOMNodeInserted', function(e) { 
	if($(e.target).hasClass('the_shop_pile')) { // new shop lazy loaded
 		 
  }
});