Question

好的，所以我的原始问题得到了解答，现在我的幻灯片效果只发生在我点击div区域的任何地方时..代码是：

$(document).ready(function(){
$('#tabs').tabs();

$("#tabs").click(function() {
     $(this).effect( "slide", "medium" );
 });
});

现在我想知道如果有人想从我的某个标签区域复制文字怎么办？他们每次尝试突出显示时，标签都会滑落。如何使标签区域仅在单击实际标签ul时滑动？

Answer 1

使用mousedown和mouseup的组合：

Demo Fiddle

var down=0;
$(document).ready(function(){
    $("#tabs").mousedown(function(event){
        down=event.clientX+"||"+event.clientY;
    });
    $("#tabs").mouseup(function(event){
        var up=event.clientX+"||"+event.clientY;
        if(up==down)
        $(this).slideUp("medium" );
    });
});

更新了阻止右键单击复制文字

的滑动的代码

Demo Fiddle 2

var down="||";
$(document).ready(function(){
    $("#tabs").mousedown(function(event){
        switch(event.which){
        case 1:/*Left mouse button pressed*/
            down=event.clientX+"||"+event.clientY;
            break;
        default:/*middle or right mouse button pressed*/
            down="||";
        }
    });
    $("#tabs").mouseup(function(event){
        var up=event.clientX+"||"+event.clientY;
        if(up==down)
        $(this).slideUp("medium" );
    });
});

Answer 2

您可以在click方法上使用事件捕获选项。通过使用它，您可以获得单击鼠标的元素。然后你可以使用目标对象，如下所示，

$('#tabs').click(function(e){
     if(e.target.nodeName == 'P') {
         e.stopPropagation();
         return;
     }
     $(this).effect( "slide", "medium" ); 
});

希望它会有所帮助。

标签的幻灯片效果第2部分

2 个答案:

Demo Fiddle

Demo Fiddle 2