<script>
$('.image-wrapper').mouseenter(function(e) {
  e.preventDefault();
  $(this).removeClass('image-wrapper');
});

$('.boxer').mouseenter(function(){
  $('.image_wrapper img').addClass('image_wrapper img:hover');
});
</script>

<script>
var background = document.getElementById('.image-wrapper');
var background = false ;

$('.image-wrapper').mouseenter(function(e) {
    e.preventDefault();
    $(this).removeClass('image-wrapper');
    background = true;
 });

$('.boxer').mouseenter(function(){
    if (background = true) {
        $('.image-wrapper').addClass('image-wrapper');
    } else {
        $('.image-wrapper').removeClass('image-wrapper');
    }
});
</script>

<div id="info_01" class="image-wrapper info_all">
    <img src="images/main_2/info_01.jpg" alt="" class="images">
    <div class="boxer"><p class="boxer_title">ABOUT</p></div>
</div>

#info_01 {
    width:512px;
    height:384px;
    background:no-repeat;
    position:absolute;
}

.image-wrapper {
  font-size: 0;
  overflow:hidden;
}

.image-wrapper img {
  max-width: 100%;
  transition: transform .3s ease-in-out;
}

.image-wrapper:hover img {
  transform: scale(1.1);
}