Question

我有一个带有地图的网站，地图有不同的区域可以点击和点击，我想要的是当我悬停或点击一个区域时，页面上会出现一个div，一些内容。 我尝试使用overflow:hidden;，但似乎无法完成这项工作，使用的代码是什么，甚至可能？

有两个div已经内容已经准备好了，默认情况下这些应该是隐藏的，当来到网站并且徘徊点击一个区域时，它们应该出现，而不是两者，但是与区域对应的那个，我将div与彼此分开，以便不会重叠。

该网站由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}

Answer 1

你想让你的div显示：无; 并悬停以改变你想要显示的div的显示...

Fx的：

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

或者使用Jquery：

$(".no19").hover(function() {
$("#aust-agder").css({"display":"block"});
});

在悬停或单击时显示div，并将div隐藏为默认值

1 个答案: