0

ここでの最初の投稿なので、我慢してください!

jquery ui tabs プラグインを使用してギャラリーを作成しています。左右に小さな矢印をスライドさせて、どのギャラリーが表示されているかをユーザーに表示したいと考えています。

私が使用しているコードはこれです:

<script>
if ($('#wedding-btn').hasClass('ui-state-active')) {
    $('.nav-selector').css('left', '5px');
} else if ($('#portrait-btn').hasClass('ui-state-active')) {
    $('.nav-selector').css('left', '125px');
} else if ($('#landscape-btn').hasClass('ui-state-active')) {
    $('.nav-selector').css('left', '255px');
} else if ($('#blackandwhite-btn').hasClass('ui-state-active')) {
    $('.nav-selector').css('left', '410px');
}   
</script>

ここに私が話していることを示すリンクがあります: http://www.maxhenchman.co.uk/oh/latest2/

ここで他の記事を見てきましたが、上記のコードはうまくいくようです...しかし、私はjqueryにかなり慣れていないので、おそらく間違っています。

どんな助けでも素晴らしいでしょう!

ありがとう、

マックス

ジョニーの編集:

<script type="text/javascript">

    $(document).ready(function() {

        $( "#tabs" ).tabs({
            show: { effect: "fade", duration: 400 },
            hide: { effect: "fade", duration: 800 }
        });

    });

    </script>

    <script type="text/javascript">
            $(document).ready(function() {

            $('#wedding-btn').click(function(){
                if($(this).hasClass('ui-state-active'))
                        $('.nav-selector').css('left', '5px');
                });

            $('#portrait-btn').click(function(){
                if($(this).hasClass('ui-state-active'))
                        $('.nav-selector').css('left', '125px');
                });

            $('#landscape-btn').click(function(){
                if($(this).hasClass('ui-state-active'))
                        $('.nav-selector').css('left', '255px');
                });

            $('#blackandwhite-btn').click(function(){
                if($(this).hasClass('ui-state-active'))
                        $('.nav-selector').css('left', '410px');
                });

            });

    </script>
4

2 に答える 2

0

ここで私の最終的な答えは、遅延が必要なため、classcheck を関数にラップし、setTimeout を使用して遅延して .click() で呼び出しました。ここにコード:

    function check_location(){

        if ($('#wedding-btn').hasClass('ui-state-active')) {
            $('.nav-selector').css('left', '5px');
        } else if ($('#portrait-btn').hasClass('ui-state-active')) {
            $('.nav-selector').css('left', '125px');
        } else if ($('#landscape-btn').hasClass('ui-state-active')) {
            $('.nav-selector').css('left', '255px');
        } else if ($('#blackandwhite-btn').hasClass('ui-state-active')) {
            $('.nav-selector').css('left', '410px');
        }

    }

    $('#tabs').click(function(){

        setTimeout(check_location,1000)

    });
于 2013-05-09T14:12:23.420 に答える