Заменить div on hover (div rollover)

Question

У меня есть два div с разными данными. Я хочу заменить div другим на зависание.

Я могу сделать это в CSS, но у моих данных есть изображения и ссылки. поэтому я использовать изображение в CSS я не могу поставить

<a href=""></a>

на для изображения. также у меня есть 4 разных изображения в погружении. , поэтому я хочу, чтобы при использовании наведите курсор на эту область, мой первый div должен быть заменен на 2-й div.

Спасибо

Answer 1

Ни один пример не указан, поэтому я предполагаю.

HTML

<div id="div1">Some data</div> 
<div id="div2" style="display:none;">Some other data</div> 

Javascript (с JQuery)

$("#div1").on('mouseover', function() { 
    $("#div2").show(); 
    $(this).hide(); 
}); 

Это не тестируется так попробовать его увидеть, если он делает то, что вы хотите.

Answer 2

Если вы не хотите использовать javacript, вы можете сделать это вот так.

Вы можете изменить содержимое разделов.

.child-one{ 
 
    display : block; 
 
} 
 

 
.child-two{ 
 
    display : none; 
 
} 
 

 
.parent:hover .child-one{ 
 
    display : none 
 
}

<div class="parent"> 
 
    <div class="child-one"> 
 
    text of child one 
 
    </div> 
 
    <div class="child-two"> 
 
    text of child two 
 
    </div> 
 
</div>