即时通讯使用,并希望当用户悬停在一些文本时弹出一个框
问题描述:
我使用Weebly并希望当用户将鼠标悬停在特定文本上时弹出一个框,给他们关于特定单词的更多详细信息。我可以在周末做这个,或者我可以添加代码。即时通讯使用,并希望当用户悬停在一些文本时弹出一个框
答
也许你可以添加应用程序到weebly从AppStore的,但你也可以使用这样的:
<style>
.tooltip {
position: relative;
display: inline-block;
border-bottom: 1px dotted black;
}
.tooltip .tooltiptext {
visibility: hidden;
width: 120px;
background-color: black;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
}
.tooltip .tooltiptext {
width: 120px;
bottom: 100%;
left: 50%;
margin-left: -60px;
}
.tooltip:hover .tooltiptext {
visibility: visible;
}
</style>
<center>
<br><br>
<div class="tooltip">Word
<span class="tooltiptext">More words</span>
</div>
</center>
只要复制了整个事情,改变“字”和“更多的话”。如果你想弹出框在其他地方让我知道。
谢谢,我会给它一个 –
@MattTyrrell没问题 – Blackmagyk
在html中,我将这个代码放在哪里? –