-3

アコーディオンのjQuery機能では、UIプラグインを使用せずに、左、右、上、下を使用してタブの位置を動的にシフトするにはどうすればよいですか?

例: 1.上、2.下、3.左、4.右の 4 つの値を持つドロップダウンがあります。

If i click on top -    Tabs should display top to bottom direction
If i click on bottom - Tabs should display bottom to top direction
If i click on left -   Tabs should display left to right direction
If i click on left -   Tabs should display right to left direction
4

1 に答える 1

0

次のコードを試すことができます。このコードは完全ではないことに注意してください。すべてのケースを追加する必要があります...

$("select").change(function() {
    var str = "";
    $("select option:selected").each(function() {
        str += $(this).text() + " ";
    });

    switch (str) {
    case 'top':
        $("#tabs").addClass("ui-tabs-vertical ui-helper-clearfix");
        $("#tabs li").removeClass("ui-corner-top").addClass("ui-corner-left");
        break;

    case 'bottom':
        // fix the classes
        $( ".tabs-bottom .ui-tabs-nav, .tabs-bottom .ui-tabs-nav > *" )
            .removeClass( "ui-corner-all ui-corner-top" )
            .addClass( "ui-corner-bottom" );

        // move the nav to the bottom
        $( ".tabs-bottom .ui-tabs-nav" ).appendTo( ".tabs-bottom" );
        break;

    case 'left':
        // change the required classes
        break;

    case 'right':
        // change the required classes
        break;
    }
});
于 2013-01-02T19:07:10.373 に答える