7

ここでこれを試しました: http://jsfiddle.net/92HXT/1/しかし、動作しません。show("slow")/を使用した場合にのみ機能しますhide("slow")。

ありがとう。

4

2 に答える 2

19

最も鮮明なアニメーションではありませんが、親を見つけてすべての兄弟を非表示にすることで、あなたが望むように動作できるようにしました。これが要素を左にスライドさせる理由はまだわかりませんが、への直接呼び出しはそうで.siblings()はないようです。

ここで見られます。

他の人が述べたように、クラスを使用してアイテムのグループを識別することは、ID ではなく正しいアプローチです。

更新：

siblings() が ID で見つけた div の兄弟を見つけられない理由はまだわかりませんが、表示/非表示のプロセス、またはスライド アニメーションを使用するプロセスで何かを行う必要があると思われます。 . これが私の提案するjQuery / jQueryUIです：

$('a.view-list-item').click(function () {
    var divname= this.name;
    $("#"+divname).show("slide", { direction: "left" }, 1000);
    $("#"+divname).parent().siblings(":visible").hide("slide", { direction: "left" }, 1000);
});

これが更新されたバージョンです。

更新：

@jesus.tesh によるソリューションの優れた更新

更新：

@erwinjulius によるソリューションの動作の更新。DIV の位置を変更して動作を改善し、ユーザーがアニメーションを中断することなくリンクをすばやくクリックできるようにしました。効果の表示を改善するためだけに、白い背景と左パディングを追加しました。

于 2012-06-13T14:51:55.953 に答える
1

ただし、このコードは機能します。要素の名前タグは W3C 標準では廃止されています。

ID を試してみましたが機能しませんでした。名前タグをタイトルに変更しました。これも機能し、W3C 標準に準拠しています。

このように「名前」を「タイトル」に変更すると、うまく機能します。

<script type="text/javascript">
    $(document).ready(function() {
        $('a').click(function() {
            var divtitle = this.title;
            $("#" + divtitle).show("slow").siblings().hide(1000);
        });
    });
</script>
于 2016-10-04T12:04:02.753 に答える