如何用jquery将文本一一上下滑动?

发布于 2024-12-20 21:57:54 字数 1566 浏览 2 评论 0原文

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

扫码二维码加入Web技术交流群

发布评论

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

评论(2

只等公子 2024-12-27 21:57:54

您尚未发布任何 HTML,因此我假设您使用的标记在菜单方面或多或少是“标准”的。

因此,假设您处于以下标记的范围内:

<ul id="menu">
    <li>Category 1
        <ul><!-- links --></ul>
    </li>
    <li>Category 2
        <ul><!-- more links --></ul>
    </li>
    <!-- ... and so on -->       
</ul>

您可以使用类似以下内容来实现您想要的(根据我的理解):

jQuery(function($) {

    var $menu = $('#menu'),
        $menu_items = $menu.children('li')
        ;

    $menu_items.click(function () {

        $menu_items.not(this).slideUp();
        $(this).slideDown();

    });

})

这样,您在添加/删除时不必添加/更改任何代码#menu 中的菜单项。

You haven't posted any HTML, so I'm assuming that you're using markup which is more or less "standard" when it comes to menus.

So assuming that you're within the ballpark of the following markup:

<ul id="menu">
    <li>Category 1
        <ul><!-- links --></ul>
    </li>
    <li>Category 2
        <ul><!-- more links --></ul>
    </li>
    <!-- ... and so on -->       
</ul>

You can achieve what you want (from what I understand), using something like:

jQuery(function($) {

    var $menu = $('#menu'),
        $menu_items = $menu.children('li')
        ;

    $menu_items.click(function () {

        $menu_items.not(this).slideUp();
        $(this).slideDown();

    });

})

This way, you don't have to add / change any code when you add / remove menu items from your #menu.

彩扇题诗 2024-12-27 21:57:54

您可以使用它,

$("#category1").click(function(){
$("#category2content").animate({"height","0"},normal,linear,function(){$("#category1content").animate({"height","500"},normal)});
});

$("#category2").click(function(){
$("#category1content").animate({"height","0"},normal,linear,function(){$("#category2content").animate({"height","500"},normal)});
});

如果需要的话可以添加额外的功能以使其更加具体。如果需要,可以将其重新用于您的内部内容。

请阅读 http://api.jquery.com/animate/ 了解更多信息。将 500 更改为您需要的任何高度。

You could use this

$("#category1").click(function(){
$("#category2content").animate({"height","0"},normal,linear,function(){$("#category1content").animate({"height","500"},normal)});
});

$("#category2").click(function(){
$("#category1content").animate({"height","0"},normal,linear,function(){$("#category2content").animate({"height","500"},normal)});
});

you can add extra functions if needed to make it more specific. This can be reused for your inner contents if need be.

Do read up on http://api.jquery.com/animate/ for more info. Change the 500 to any height that you need.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文