JSFiddle - React, Tailwind, and code Playground

JavaScript

var imageHover = function(){
	var _this = this,
		side;

	this.init = function(){
		//console.log("init imageHover")
	    var x;
		$("html,body").live("mousemove",function(e){
			//console.log("mousemove: "+e.pageX)  
			var width_window = $(window).width();
			var center = width_window /2;
			if(e.pageX < center){
				side = 'left';
			}else{
				side = 'right';
			}
		});

		$(".info").hover(
			function () {
				//OVER
			    //console.log("hover")  
				var $img = $(this).children("img");
				$img.width($img.data("width"));
				$img.height($img.data("height"));
				//console.log($img.width())  
				$(this).children("img").css("visibility","hidden");
				$(this).children("img").show();

				//ICI ON LANCE LA FONCTION QUI VA GERER LE RESIZE
				_this.resizeImg($(this).children("img"),$(this).offset());

				if(side == 'right'){
					var w_img = $(this).children("img").width();
					$(this).children("img").css("left",-w_img)
				}
				
				$(this).children("img").css("visibility","visible");
				
				$(".info").children("img").bind("click", function(){
					$(this).hide();
				});

			},
			function () {
				//OUT
				$(this).children("img").hide();
			}
		);



		$(window).resize(function(){
			//_this.resizeImg();
			$(".info").children("img").each(function(){
				//_this.resizeImg($(this));
				$(this).hide();
			});

		})
	}
	

	this.resizeImg = function(img,offset){
		var d = new Date();
		//console.log(d, side);

		var window_height = $(window).height();
		var img_height = $(img).height();
		var img_top = $(img).offset().top;

		var window_width = $(window).width();
		var img_width = $(img).width();
		var img_left;
		side == 'left' ? img_left = offset.left : img_left = window_width - offset.left;

		console.log(window_width, img_left)
		var image_resize_height = window_height-img_top-20;
		var image_resize_width = window_width-img_left-20;

		if(img_height + img_top > window_height && img_width + img_left > window_width){
			console.log("h...