Настройка вкладок инструментов Jquery - PullRequest
Новая
       44

Настройка вкладок инструментов Jquery

1 голос
/ 18 апреля 2011

Я хочу сделать то же самое.

мы можем легко делать вкладки с помощью jquery (http://flowplayer.org/tools/demos/tabs/skins.html), но я не знаю, как отобразить содержимое по умолчанию на вкладке содержимого place.pls, посмотрите изображение, которое покажет, что я хочу именно.

пожалуйста, помогите и дайте идею сделать.

1 Ответ

1 голос
/ 18 апреля 2011

Я создал скрипку здесь: http://jsfiddle.net/garreh/cfmvE/

Должны ли вы начать в правильном направлении. Если вы хотите использовать вкладки пользовательского интерфейса jQuery, взгляните на миллионы примеров в Интернете. Однако то, что вы пытаетесь сделать, очень просто и может быть легко достигнуто с помощью прилагаемой скрипки. Добавить ajax в код очень просто. 

<div id="tab_container">
    <div class="tab_content tab_1 tab_active">
        What's your name?<br/><br/>
        <input type="text"/>
    </div>
    <div class="tab_content tab_2">
        Some other question
    </div>
    <div class="tab_content tab_3">
        A final question blah
    </div>        
</div>

<div id="tabs">
    <a href="#" tab="1">Question 1</a>
    <a href="#" tab="2">Question 2</a>
    <a href="#" tab="3">Question 3</a>
</div>

JQuery: 

$('#tabs > a').click(function() {
    var $tab = $('.tab_' + $(this).attr('tab'));
    if ($tab.length)
    {
        // Hide active tab & selected style:
        $('.tab_active').removeClass('tab_active');
        $('#tabs .active').removeClass('active');

        // Show clicked tab content
        $tab.addClass('tab_active');

        // Set tab styling
        $(this).addClass('active');
    }
});

CSS доступен на скрипке.

Edit:

Вот еще одна скрипка , демонстрирующая вкладки, использующие только HTML, с помощью трюка с гиперссылкой. Javascript не требуется: http://jsfiddle.net/garreh/6e2w5/

...