将效果应用于 jquery-ui 选项卡

发布于 2024-08-28 19:28:55 字数 256 浏览 13 评论 0原文

是否可以将效果应用于 jquery-ui 选项卡，我还没有看到任何示例，并且我相当确定如果可能的话，以下内容是不正确的：

<script type="text/javascript">
    $(function() {
        $("#tabs").tabs();
        $("#tabs").effect(slide,options,500,callback);
    });
</script>

原文

Is it possible to apply an effect to a jquery-ui tab, I haven't seen any examples of it, and I'm fairly sure that if it is possible the following is incorrect:

<script type="text/javascript">
    $(function() {
        $("#tabs").tabs();
        $("#tabs").effect(slide,options,500,callback);
    });
</script>

分享到QQ

分享到微博

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

发布评论

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

樱＆纷飞 2024-09-04 19:28:55

如果您希望在更改标签时发生效果，您可以执行类似的操作使用 fx 选项：

$(function() {
  $("#tabs").tabs( { fx: { height: 'toggle' } } );
});

淡入淡出 + 幻灯片如下所示：

$(function() {
  $("#tabs").tabs( { fx: { height: 'toggle', opacity: 'toggle' } } );
});

这会将效果应用于选项卡本身，

You can do something like this, if you want the effect to happen when you change tags using the fx option:

$(function() {
  $("#tabs").tabs( { fx: { height: 'toggle' } } );
});

A fade + slide would be like this:

$(function() {
  $("#tabs").tabs( { fx: { height: 'toggle', opacity: 'toggle' } } );
});

This applies the effects to the tabs themselves, you can take it for a spin here.

回复收藏 0 原文

燕归巢 2024-09-04 19:28:55

  $(function () {
        $("#tabs").tabs({
            beforeLoad: function (event, ui) {
                if (ui.tab.data("loaded")) {
                    event.preventDefault();
                    return;
                }
                ui.ajaxSettings.cache = false,
                ui.panel.html('<img src="images/loader.gif" width="24" height="24" style="vertical-align:middle;"> Loading...'),
                ui.jqXHR.success(function() {
                    ui.tab.data( "loaded", true );
                }),
                ui.jqXHR.error(function () {
                    ui.panel.html(
                    "Couldn't load Data. Plz Reload Page or Try Again Later.");
                });
            }
        });
    });

  $(function () {
        $("#tabs").tabs({
            beforeLoad: function (event, ui) {
                if (ui.tab.data("loaded")) {
                    event.preventDefault();
                    return;
                }
                ui.ajaxSettings.cache = false,
                ui.panel.html('<img src="images/loader.gif" width="24" height="24" style="vertical-align:middle;"> Loading...'),
                ui.jqXHR.success(function() {
                    ui.tab.data( "loaded", true );
                }),
                ui.jqXHR.error(function () {
                    ui.panel.html(
                    "Couldn't load Data. Plz Reload Page or Try Again Later.");
                });
            }
        });
    });

回复收藏 0 原文

~没有更多了~