JSFiddle - React, Tailwind, and code Playground
by D S
HTML
<div class="intro">
<div class="intro_bg"></div>
</div>
CSS
.intro {
width: 600px;
height:600px;
overflow:hidden;
}
.intro_bg {
width: 100%;
height: 100%;
background: url(http://192.168.0.11/bonbonniere/Landing%20page%20NEW/img/LondonWall.jpg);
background-position:center center;
background-size:cover;
transition:all 5s ease-in-out;
}
.intro_bg.zout {
transform:scale(1.5);
}
JavaScript
$(".intro").hover(function () {
$('.intro_bg').addClass('zout');},
function(){
$('.intro_bg').removeClass('zout');}
);