jquerywordpresstiptip

Adding a variable to tiptip jQuery


I couldn't think of a more descriptive title, so I do hope it makes sense (feel free to correct me if I am wrong).

Basically I am adding tables to a site and the columns will automatically resize according to the amount of columns being added. Adding a single works perfectly well, where it's getting a bit complicated for me (perhaps over the head) is as soon as I add an additional table on the same page - the script which runs counts all of the columns in their entirety.
For instance, if I add a three column table at the top of the page then and additional three column table at the bottom - the script then counts a total of 6 columns then divides 100 by that number..

Is there a simple way to create a variable or a table count so that the script at the bottom detects separate tables and resizes the columns per table?

Snippets of the code below:

<div class="table<?php echo $tblid; ?>">
        <div class="cols">
        </div>

    ..code going on here..
        <div class="cols">
        </div> 
    ..Some more code going on here..
</div>

    var v = jQuery('.table .cols').length;

    var cw = (100/v);

    jQuery('.table .cols').css('width',cw+'%');


Solution

  • If i am not wrong, youu have two tables with the same classname , so your selector jQuery('.table .cols') gets both the table and jQuery('.table .cols').length; will give you the length of the cols combining both the tables...

    what you can do is. Give them seperate class and call each one..

    HTML

     <div class="table1">
        <div class="cols">
        </div>
    
      ..other code going on here..
    
    </div>
    
    <div class="table2">
        <div class="cols">
        </div>
    
      ..other code going on here..
    
    </div>
    

    Jquery

    jQuery(function(){
      jQuery('div[class^="table"]').each(function(){
        var obj=jQuery(this).find('.cols');
        var v = obj.length;
        var cw = (100/v);
    
        obj.css('width',cw+'%');
      });
    });
    

    this should work for any number of tables..