Question

您好我在下面使用以下Jquery函数来显示和隐藏地图时单击链接，但问题是链接在第三次点击之前不会触发。

我已经在所有浏览器中对它进行了测试，因此它不是一个严重的问题...... 这是javascript：

   $('#goo').live('click',function()  {
if ($('#map').is(':visible')){
  $('#map').slideUp('slow');  //or .toggle           
} else{
  $('#map').slideDown('slow'); //or .toggle   
  $("#map").css('visibility','inherit');
  $("#map").css('position','relative');
}
 return false;

}）;

这是HTML：

<div id="wholeDiv">
<a href="#" id="goo"> Show Map </a>
<div id="map">&nbsp;</div>
<div id="testdiv"><img src="Kids_GiftGuide_SB.jpg" />
</div></div>

我也会包括css：

#map{
            position:absolute;
            width:450px;
            height:400px;
    visibility:hidden;

}

Answer 1

可见性：隐藏是问题

将此更改为display：none，它将在第一次单击时起作用

您也可以删除$("#map").css('visibility','inherit');

另外，为什么第一次重新隐藏position: relative时会调用它？这几乎肯定也是一个错误。如果位置是相对的，那么它可能应该从CSS代码中的那个开始。

第三次单击后，JQuery向上滑动并执行slide方法

1 个答案: