4

I was wondering, how can I make jquery UI not to adds any class when it initializes the $.tabs() ?

This is my html structure

<link href="smoothness/jquery-ui-1.8.20.custom.css" rel="stylesheet" type="text/css" />
...
<link href="estilos_scoreboard.css" rel="stylesheet" type="text/css" />
...

<div id="tab_container">
    <ul class="ui-tabs-nav">
        <li><a href="#tab_equipos"><span>Equipos</span></a></li>
        <li><a href="#tab_jugadores"><span>Jugadores</span></a></li>
        <li><a href="#tab_partidos"><span>Partidos</span></a></li>
        <li><a href="#tab_directos"><span>Directos</span></a></li>
    </ul>

    <div id="tab_equipos">... cargando ...</div>
    <div id="tab_jugadores">... cargando ...</div>
    <div id="tab_partidos">... cargando ...</div>
    <div id="tab_directos">... cargando ...</div>       
</div>

javascript code:

$(document).ready(function(){
    $('div#tab_container').tabs();
    $('div#tab_equipos').load('lv_equipos.php');
});

In estilos_scoreboard.css I have my css styles which works great if I don't load smoothness/jquery-ui-1.8.20.custom.css

So I was wondering, is there any way to tell $.tabs() not to apply none of its styling?

//note: I am asking this because I'm not the one that code it this way, but the one to apply quick fixes and I need smoothness/jquery-ui-1.8.20.custom.css for jquery UI Autocomplete and other features

Alex
  • 7,538
  • 23
  • 84
  • 152

2 Answers2

4

As far as I know, this cannot be done through default code/options. You can, however, just remove all jQuery classes after applying tabs.

The jQuery library uses the prefix ui- for all classes, so you can remove all those classes at once after applying your tabs / plugin.

This should work:

removeByClassPrefix(document.getElementById("element"), "ui-");

function removeClassByPrefix(el, prefix) {
    var regx = new RegExp('\\b' + prefix + '.*?\\b', 'g');
    el.className = el.className.replace(regx, '');
    return el;
}

Or:

$("#element").className = $("#element").className.replace(/\bui-.*?\b/g, '');

Above function thanks to Prestaul for this answer: Remove all classes that begin with a certain string

Community
  • 1
  • 1
Wouter Konecny
  • 3,260
  • 3
  • 19
  • 26
  • 2
    Try this instead: $("#element").attr("class", $("#element").attr("class").replace(/\bui-\S+\b/g, '')); – David Feb 12 '13 at 22:22
0

Well, I decided for know just to use a simple if:

<?php if($_ADM['mod'] == 'scoreboard') {  ?>
    <link href="estilos_scoreboard.css" rel="stylesheet" type="text/css" />
<?php } else { ?>
    <link href="<?=BASE_URL;?>assets/css/smoothness/jquery-ui-1.8.20.custom.css" rel="stylesheet" type="text/css" />
<?php } ?>
Alex
  • 7,538
  • 23
  • 84
  • 152