使用javascript在文本悬停时显示摘要块中的图像

<div class="hover-container">
  <p>这里是文本内容</p>
  <div class="summary-block">
    <img src="image.jpg" alt="图像">
    <p>这里是摘要内容</p>
  </div>
</div>

.summary-block {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #fff;
  padding: 10px;
  border: 1px solid #ccc;
}

var hoverContainer = document.querySelector('.hover-container');
var summaryBlock = document.querySelector('.summary-block');

hoverContainer.addEventListener('mouseover', function() {
  summaryBlock.style.display = 'block';
});

hoverContainer.addEventListener('mouseout', function() {
  summaryBlock.style.display = 'none';
});