Javascript 选项卡的幻灯片效果

我正在尝试在选项卡之间制作幻灯片效果。以下是jQuery代码：

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

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

这是可行的，但如果你点击页面上的任何地方，它都会起作用。我希望它只在您单击该选项卡时工作。我知道这是因为我必须从点击功能中删除“文档”。我尝试用

#tabs

，

#tabs.ui tabs nav ul

，

#tabs.ui tabs nav li

替换“文档”。单击功能需要在其中添加什么？

试试这个

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

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

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

---或单击选项卡锚定：

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

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

---

我正在测试这一点，如果单击选项卡区域，滑动效果似乎开始发挥作用。如果我的查看器希望从选项卡区域复制和粘贴，该怎么办？我想让您只单击实际选项卡本身，然后选项卡区域滑动。现在，每当我单击#tab div中的任何位置时，选项卡区域都会滑动。我希望只有在单击#tab div时#tab div才会滑动。我该怎么做？你必须给我html。。一般来说，结构是

• 。。。。所以你可以做一些类似$（document.ready（function（）{$（'tabs'）.tabs（）；$（'a[id^=“tabs-”）。点击（function（）{$（'tabs'）。效果（“幻灯片”，“中间”）；}）；它似乎不起作用。这是我的html。
  • 这是选项卡1
    这是选项卡2
    这是选项卡3
    是的，这是我不会工作，因为你的id是#tab而不是#tabs-所以我更新了ans。当我使用第二位代码时，幻灯片功能完全消失了