0

我在下一页上使用了一个名为 capSlide 的 jquery 脚本

http://sundial.whistlerwebhosting.com/meetings-events/whistler-weddings

当用户将鼠标悬停在图像上时，顶部会出现一个透明的叠加层，并且标题会向上滑动，并带有标题和更多信息链接。

我想让整个 div 区域可点击。我在想，由于叠加层出现在它的这个 div 的顶部，我需要通过链接激活它。我正在尝试使用以下 jquery 脚本，但它不起作用。

jQuery('.overlay').click(function(){
     window.location=jQuery(this).parent().find('a').attr('href'); 
       return false;
});

HTML输出如下

<div class="ic_wrapper">
   <div id="capslide_img_cont11" class="ic_container"><img typeof="foaf:Image" src="/sites/all/themes/sundial/images/weddings/Wedding-Consulants.jpg" width="290" height="180" alt="Whistler Wedding Consulants" />
    <div class="overlay" style="display:none;"></div>
    <div class="ic_caption">
      <h3>Wedding Consulants</h3>
      <a href="/meetings-events/whistler-weddings/wedding-planners">
      <p class="ic_text">More Info</p>
       </a> </div>
   </div>
</div>

任何见解将不胜感激

4

2 回答 2

0

我将假设您的点击事件没有被注册，因为覆盖 div 是在您的脚本运行后添加的。尝试使用on()或delegate()jQuery 函数。一个例子：

 jQuery(".ic_container").on("click", ".overlay", function(){
        window.location = jQuery(this).parent().find('a').attr('href'); 
        return false;
 });
于 2012-07-13T00:04:48.540 回答
0

在您的脚本文件 (functions.js) 中，您在文档就绪函数之外设置了单击处理程序。相反，把它放在你的 ready 函数中：

jQuery(document).ready(function() {
    jQuery('div#block-menu-menu-meeting-events-right.block div.content ul.menu li.last a').addClass('fancybox.iframe');

    // Your code has been moved to here...
    jQuery('.overlay').click(function(){
        window.location=jQuery(this).parent().children().find('a').attr('href'); 
        return false;
    });    
});

这使它等到页面准备好后再应用您的点击处理程序。

于 2012-07-13T00:58:24.560 回答