1

我有一个很长的 html，内容有其他文本的参考。

例如：

What is your <a href="#A8">favorite</a> day?
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div id="A1">Monday</div>
<div id="A2">Tuesday</div>
<div id="A3">Wednesday</div>
<div id="A4">Thursday</div>
<div id="A5">Friday</div>
<div id="A6">Saturday</div>
<div id="A7">Subday</div>
<div id="A8">It's a good day.</div>

我希望有一个功能可以将鼠标悬停在锚标记上，以在锚名称的弹出窗口或对话框中显示内容，而不是单击以转到内容。没有来回走动。

如果悬停在 上#A8，它会显示 的内容A8，即“今天是个好日子”。

4

3 回答 3

0

几个选项。

  1. 使用 lightbox/thickbox/jqueryA8在叠加​​层中显示部分中的内容。

  2. 替换<a href="#A8">favorite</a>为<a href="javascript:void(0)" onclick="openPopup('#A8')">favorite</a>。在函数 openPopup 中，获取该部分的内容A8并将其显示在弹出窗口中（使用 window.open）。

希望有帮助。

于 2012-11-08T07:38:29.147 回答
0

我想到的开始的快速：

<div class="day" id="A1">Monday<div class="content">your content that will show up on hover for Monday</div></div>
<div class="day" id="A2">Tuesday<div class="content">your content that will show up on hover for Tuesday</div></div>
<div class="day" id="A3">Wednesday<div class="content">your content that will show up on hover for Wedsday</div></div>
<div class="day" id="A4">Thursday<div class="content">your content that will show up on hover for Thursday</div></div>
<div class="day" id="A5">Friday<div class="content">your content that will show up on hover for ...</div></div>
<div class="day" id="A6">Saturday<div class="content">your content that will show up on hover for ...</div></div>
<div class="day" id="A7">Subday<div class="content">your content that will show up on hover for ...</div></div>

在 CSS 中添加：

.day .content{
display:none;
}
.day:hover .content{
display:block;
}

稍后您可以尝试 JQuery 提供的一系列效果。

于 2012-11-08T07:45:36.690 回答
0 
try like this

What is your <a href="#" onclick=GoodDay();>favorite</a> day?
<div></div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div id="A1">Monday</div>
<div id="A2">Tuesday</div>
<div id="A3">Wednesday</div>
<div id="A4">Thursday</div>
<div id="A5">Friday</div>
<div id="A6">Saturday</div>
<div id="A7">Subday</div>

<script>
function GoodDay(){  $(this).next('div').text("It's a good day.");}
<script>
于 2012-11-08T07:52:50.703 回答