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

私の頭に浮かぶ開始の速さ：

<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 に答える
0

いくつかのオプション。

  1. lightbox/thickbox/jquery を使用して、セクションのコンテンツをA8オーバーレイで表示します。

  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 に答える