Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>OK I got it. Continuing <a href="https://stackoverflow.com/users/1201967/fricke">fricke</a></p> <p>approach which is fixing the column...</p> <p>It seems that you need a map of fixed columns and prevent pileing on ot top of another. It's not replaced as you thought it's just that probably the newly fixed goes on top of the old one.</p> <p>So you do that:</p> <pre><code>var fixedColumns = jQuery(); $('#id_of_column').click(function () { var that = $(this); if (that.hasClass('locked')) { //Unlock that.removeClass('locked') .css({'left': ''}); fixedColumns = fixedColumns.not(that); } else { //Lock fixedColumns = fixedColumns.add(that); that.addClass('locked'); orderLockedColumns(fixedColumns); } }); function orderLockedColumns(columns) { var that, leftPos, prevCol, prevColWidth, prevColPos; columns.each(function (i) { that = $(this), leftPos = 0; if (i !== 0) { prevCol = jQuery(columns[i - 1]) prevColWidth = prevCol.width(); prevColPos = prevCol.position().left; leftPos = prevColPos + prevColWidth } that.css('left', leftPos+'px'); }) } </code></pre> <p><strong>CSS:</strong></p> <pre><code>.locked{ position:fixed; } </code></pre> <p>However I do not recommend adding multi-listeners based on <code>id</code> !</p> <p>It's better using <code>class="lockButton"</code> and then if you need the id you can take it. So it's better:</p> <pre><code>jQuery(document).on('click','.lockButton'){ var that = $(this), id = that[0].id; //... same code } </code></pre> <p>Additionally since you didn't provide code and this is bad most people won't help you here if you don't provide any... so this code above might not work since I don't know your markup at all just guessing.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload