Question

我有一个div，其中包含一个图像，该图像是指向该网站上另一个页面的链接。我想翻转这个。图像“反向”上的内容将是文本，其中可能还包含其他链接。

我见过Flip，QuickFlip 1＆amp; 2以及CSS3 Transitions的各种其他插件和插件但问题是它们（据我所知）涉及单击div本身来执行翻转。

因为div包含正面和背面的链接，这显然不适合我的目的，我需要的是div / flip-area外的按钮/点击器。出于某种原因，我没有看到任何这样的事情。

任何人都知道或有任何想法吗？

Answer 1

这样的事情是否足够？（使用上述插件之一。）

$('#your_button_outside_div').click(function(){
    $('#div_that_you_normally_would_have_to_click').trigger('click');
});

然后你可以在“应该被点击”的DIV中放置100％宽度，高度不可见的DIV并执行此操作以防止DIV内的点击执行翻转：

$('#masking_div').click(function(e){
    e.stopImmediatePropagation();
});

只需确保调整链接的z索引等等，在屏蔽DIV之上。

Answer 2

您可以使用这些插件并触发点击事件

$("#the_element").click(); //This will trigger the plugin events

希望这会有所帮助。干杯

Answer 3

Wanovak走在正确的轨道上，但您需要一种更加跨浏览器友好的方法来阻止事件传播。试试这个：

$('#masked_text').click(function(e){

    // Prevent click event from bubbling up the DOM to the parent container
    try
    {
        event.stopPropagation();
    }
    catch(err)
    {
        // IE does it this way
        window.event.cancelBubble=true;
    }

});

用jQuery（或CSS3）翻转Div

3 个答案: