-3

私は地図のあるサイトを持っていますが、地図にはさまざまな地域があり、それらを移動してクリックすることができます。地域にカーソルを合わせるかクリックすると、ページにdivが表示され、コンテンツが表示されます。私は使ってみましたoverflow:hidden;が、それはうまくいかなかったようです。使用する正しいコードは何ですか、それとも可能ですか？

このサイトは理解を深めるためにここにあります：http： //iseeit.no/maptest/

すでにコンテンツが含まれている2つのdivがあり、デフォルトではこれらを非表示にする必要があります。サイトにアクセスしてリージョンをクリックすると、両方ではなく、リージョンに対応するdivが表示されます。divを分割します。 tehyが重ならないように互いに離してください。

このサイトは、jquery、css、およびhtmlで構成されています。

div（css）：

#vest-agder {
    background: #111;
    ...........
}

Jquery（これが役立つ場合）：

;(function($){$.fn.cssMap=function(options){var s=$.extend({
    'size':'810',
'tooltips':false,
'tooltipArrowHeight':5,
'multipleClick':false,
'searchUrl':'search.php',
'searchLink':'',
'searchLinkVar':'region',
'clicksLimit':4,
'clicksLimitAlert':'Du kan bare velge %d region! || regioner!',
'cities':true,'visibleList':false,
'agentsListId':'addresses', 
'loadingText':'Laster inn kart ...',
'onHover':function(e){},
'onClick':function(e){},
'onLoad':function(e){}},

私がここで尋ねようとしていることを理解していただければ幸いです:)

更新1

HTMLのリージョン：

<div id="map-norge">
 <ul class="norge">
  <li class="no2"><a href="#aust-agder">Aust-Agder</a></li>
  <li class="no19"><a href="#vest-agder">Vest-Agder</a></li>
 </ul>
</div>

CSSのリージョン：

.m810 .no2:hover .bg,
.m810 .no2.focus .bg,
.m810 .no2.active-region .bg{height:86px;left:82px;top:816px;width:72px}
.m810 .no2:hover .bg,
.m810 .no2.focus .bg{background-position:-1584px -72px}
.m810 .no2.active-region .bg{background-position:-1584px -432px}

.m810 .no19:hover .bg,
.m810 .no19.focus .bg,
.m810 .no19.active-region .bg{height:67px;left:70px;top:842px;width:52px}
.m810 .no19:hover .bg,
.m810 .no19.focus .bg{background-position:-767px -17px}
.m810 .no19.active-region .bg{background-position:-767px -377px}
4

1 に答える 1

0

divをDisplay：noneにします。そして、ホバーして、表示したいdivの表示を変更します...

Fx：

#aust-agder { display: none; }
.no19:hover #aust-agder { display: block; }

またはJqueryを使用する場合：

$(".no19").hover(function() {
$("#aust-agder").css({"display":"block"});
});
于 2012-06-07T12:13:04.190 に答える