Question

 #hello{
   font-size: 4em;
 }
 div.about{
   display: none;
 }
 #hello:hover  div.about {
   display: block;
 }



<pre id="hometext"><span id="hello">Hello!</span></pre>
<div class="about" id="about"><p>hello</p></div>

首先，我是stackoverflow的新手。其次，我想要超过段落的特定部分，跨度，然后让这个div出现。但它似乎没有工作..

Answer 1

你不必使用javascript：

#hometext:hover + #about { display:none; }

Answer 2

我不太确定这是否是您要求的，但您可以使用span元素的onmouseover和onmouseout属性。

通过一点点javascript，您可以实现我认为您想要做的事情：

＆＃13;

..

＆＃13;

function hideDiv() {
  document.getElementById("divToHide").style.visibility = 'hidden';
}

function showDiv() {
  document.getElementById("divToHide").style.visibility = 'visible';
}

＆＃13;

#divToHide {
  height: 100px;
  width: 100px;
  background: red;
}

#hoverMe {
  cursor: pointer; 
}

＆＃13;

Answer 3

我认为你需要一些javascript：

＆＃13;

cdev_alloc()

＆＃13;

function showOtherDiv() {
	document.getElementById("about").style.display = "block";
}

function hideOtherDiv() {
	document.getElementById("about").style.display = "none";
}

＆＃13;

#hello {
    font-size: 4em;
}

div.about {
    display: none;
}

#hello:hover div.about {
    display: block;
}

＆＃13;

这是codepen

如何将鼠标悬停在跨度上以显示div？

3 个答案: