JSFiddle - React, Tailwind, and code Playground

by unknown601

JavaScript

$('#products-view').clickToggle(function() {
$(this).transition({ scale: 0.3 });
$('#planetary-background-outside').fadeIn();

	 $('.resize').addClass(".planet-spin");
	 	var delay1 = 1000;
setTimeout(function() {
$(".planet-zoom").hover(function() {
    $(".planet-zoom").stop().not(this).fadeTo("fast", 0.1);
}, function() {
    $(".planet-zoom").stop().not(this).fadeTo("fast", 1);
});
}, delay1);
	var delay = 1000;
setTimeout(function() {
$(".planet-zoom").fadeTo("normal", 1);
	}, delay);
	$(".planet-zoom").fadeTo("normal", 1);	
  $( "#planetary-gravity-inner-system" ).fadeTo( 500 , 1, function() {
  });
    var myContainerArray=['planetary-planet-1','planetary-planet-2','planetary-planet-3','planetary-planet-4','planetary-planet-5','planetary-planet-6','planetary-planet-7','planetary-planet-8','planetary-planet-9','planetary-planet-10','planetary-planet-11','planetary-planet-12','planetary-planet-13','planetary-planet-14','planetary-planet-15','planetary-planet-16','planetary-planet-17','planetary-planet-18','planetary-planet-19'];
$(myContainerArray).each(function(i, elementId){
    $('#'+elementId).delay(0).delay(i*50).fadeIn(400);
});


}, function() {	
$(this).transition({ scale: 1.0 });
$('#planetary-background-outside').delay(550).fadeOut(500);
   var myContainerArray=['planetary-planet-19','planetary-planet-18','planetary-planet-17','planetary-planet-16','planetary-planet-15','planetary-planet-14','planetary-planet-13','planetary-planet-12','planetary-planet-11','planetary-planet-10','planetary-planet-9','planetary-planet-8','planetary-planet-7','planetary-planet-6','planetary-planet-5','planetary-planet-4','planetary-planet-3','planetary-planet-2','planetary-planet-1'];
$(myContainerArray).each(function(i, elementId){
    $('#'+elementId).delay(0).delay(i*50).fadeOut(400);
});
});
});