Comment faire pour défiler les onglets de jQuery ui?

J'ai un div avec 600px X 150px et j'ai besoin de coller un jQuery ui tabs. Il n'y aura que 2 onglets, mais chaque onglet contient beaucoup de texte et d'images, mais je ne veux pas redimensionner div. Si j'insère débordement option dans le css de la div ou .ui-tabs-là apparaissent des 2 rouleaux - 1 à partir de div et dans un autre onglet et ça défile tout le panneau d'onglets.
Question: comment insérer de défilement verticale dans le contenu de l'onglet?

Merci d'avance.

source d'informationauteur dsplatonov

  1. 22

    Je pense que j'ai une solution pour vous, si je comprends bien votre question correctement. Voici la live exemple sur jsFiddle.

    J'ai ajouté deux classes, l'une qui s'applique à l'ensemble de l'onglet de l'élément et celui qui est appliqué à chaque onglet du panneau.

    .container{
    width: 600px;
}
.panel{
    height: 150px;
    overflow: auto;
}

    (Le container classe peut également être renommé ui-tabs de sorte que vous ajoutez à la jQuery UI ui-tabs de classe, et l' panel classe pourrait être renommé ui-tabs-panel de sorte que vous ajoutez à la jQuery UI ui-tabs-panel classe.)

    Ici est la marque que j'ai utilisé...

    <div class='main'>
    <div id="tabs" class='container'>
        <ul>
            <li><a href="#tabs-1">Tab 1</a></li>
            <li><a href="#tabs-2">Tab 2</a></li>
        </ul>
        <div id="tabs-1" class='panel'>
            <p>tab1 text...</p>
        </div>
        <div id="tabs-2" class='panel'>
            <p>tab2 text...</p>
        </div>
    </div>
</div>

    Quand je crochet-ce que certains de jQuery UI onglet magie:

    $(document).ready(function() {
    $("#tabs").tabs();
});

    Je me retrouve avec une seule barre de défilement à l'intérieur de la languette.

    J'espère que cela aide!

  2. 6

    suffit d'utiliser le code css de l'interface utilisateur-onglet contenu de classe de l'un de ses semblables ajouter le code css de n'importe où dans vos feuilles de style espère que vous allez faire. 

    .ui-tab-content, .ui-tabs-panel{overflow: auto;}

    Grâce