悬停在div上触发另一个div [英] Hover on div to trigger another div

问题描述

这是我到目前为止。我想做的是，当我悬停在div book1 ，我想要div uploadbutton 。我似乎无法找到它。

This is what i have so far. What i would like to do is that when i hover on the div book1, I want the div uploadbutton to be shown. I cant seem to figure it out.

<style type="text/css">
  #uploadbutton {
   display:none;
  }
</style>

这是我的div，上面的一个是我的css风格

This is my div and the above one is my css style

<div id="book1">
<?php include 'viewing_display_pic.php'; ?>
</div>

<div id="uploadbutton">
<?php include 'upload.php'; ?>
</div>

推荐答案

您可以使用 邻近同胞选择器 ：

You can use adjacent sibling selector:

#uploadbutton {
  display: none;
}
#book1:hover + #uploadbutton {
  display: block;
}

<div id="book1">
  some random text
</div>

<div id="uploadbutton">
  some random text
</div>

相邻兄弟组合器由分隔两个简单选择器序列的加号（U + 002B，+）
字符组成。由两个序列表示的
元素在
文档树中共享相同的父，并且由第一序列表示的元素
紧接在由第二序列表示的元素之前。

The adjacent sibling combinator is made of the "plus sign" (U+002B, +) character that separates two sequences of simple selectors. The elements represented by the two sequences share the same parent in the document tree and the element represented by the first sequence immediately precedes the element represented by the second one.

这篇关于悬停在div上触发另一个div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！