当前位置：文江博客话题详情

使用 jQuery（或 CSS3）翻转 Div

发布于 2024-11-19 16:09:19 字数 265 浏览 1 评论 0原文

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

我见过 Flip、QuickFlip 1&2 以及各种其他 CSS3 转换插件和工具，但问题是它们（据我发现）都涉及单击 div 本身来执行翻转。

因为 div 包含前后链接，这显然不适用于我的目的，我需要的是 div/翻转区域之外的按钮/点击器。出于某种原因，我没有看到任何这样的事情。

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

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

埖埖迣鎅 2024-11-26 16:09:19

这样的事情就足够了吗？（使用上述插件之一。）

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

然后您可以将 100% 宽度、高度的不可见 DIV 放入“应该被单击”的 DIV 内，并执行此操作以防止 DIV 内的单击执行翻转：

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

只需确保将 z 索引调整为您的链接等，使其位于屏蔽 DIV 的“上方”。

Would something like this be sufficient? (With the use of one of the aforementioned plugins.)

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

and then you can put a 100% width, height invisible DIV inside the 'supposed to be clicked' DIV and do this to prevent clicks within the DIV from executing the flip:

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

Just make sure to adjust the z-indexes to your links, etc are 'above' the masking DIV.

回复收藏 0 原文

同尘 2024-11-26 16:09:19

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

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

希望这有帮助。干杯

You could use those plugins and trigger a click event

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

Hope this helps. Cheers

回复收藏 0 原文

你另情深 2024-11-26 16:09:19

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;
    }

});

Wanovak is on the right track, but you'll need a more cross-browser friendly approach to stopping event propagation. Try this:

$('#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;
    }

});

回复收藏 0 原文

~没有更多了~