Попытка заставить аффикс загрузочного устройства работать правильно?

Question

Я использую аффикс бутстрапа, чтобы вставить div и навигационный div на левой стороне. Но просто добавив аффикс класса к двум div, которые я хотел бы придерживаться, этого не делал. http://jsfiddle.net/wesweatyoushop/rmuq25ak/4/

Обе дивы можно прокручивать сказать 260px, а затем следует придерживаться, но они накладываются друг на друга

$('#total_price').affix({ 
    offset: { 
     top: 260 
    } 
}); 

$('#mainNavShop').affix({ 
    offset: { 
     top: 260 
    } 
}); 

Answer 1

Вместо того, чтобы прикрепить два элемента, используя одни и те же параметры CSS, просто создать один родительский DIV, который получает проставленный. Работа скрипку: http://jsfiddle.net/keliix06/1yb1vLrp/

<div class="container"> 
    <div class="row"> 
     <nav id="leftCol" class="col-sm-3 col-md-3 col-lg-3"> 
      <h1>Dashboard</h1> 

      <div class="profile"> 
       <img src="http://placehold.it/150x150" alt="" class="img-circle" /> 
       </div> 

      <div class="affix" id="affix_this"> 
      <div class="alert-success alerts-heading" id="total_price"> 
      <p class="">&euro; 200</p> 
       </div> 
     <ul id="mainNavShop" class="list-group bs-wizard-sidebar" role="menu"> 
      <li><a href="#overview"><i class="icon-chevron-right"></i> Overview</a> 

      </li> 
      <li><a href="#transitions"><i class="icon-chevron-right"></i> Transitions</a> 

      </li> 
      <li><a href="#modals"><i class="icon-chevron-right"></i> Modal</a> 

      </li> 
      <li><a href="#dropdowns"><i class="icon-chevron-right"></i> Dropdown</a> 

      </li> 
      <li><a href="#scrollspy"><i class="icon-chevron-right"></i> Scrollspy</a> 

      </li> 
      <li><a href="#tabs"><i class="icon-chevron-right"></i> Tab</a> 

      </li> 
      <li><a href="#tooltips"><i class="icon-chevron-right"></i> Tooltip</a> 

      </li> 
      <li><a href="#popovers"><i class="icon-chevron-right"></i> Popover</a> 

      </li> 
      <li><a href="#alerts"><i class="icon-chevron-right"></i> Alert</a> 

      </li> 
      <li><a href="#buttons"><i class="icon-chevron-right"></i> Button</a> 

      </li> 
      <li><a href="#collapse"><i class="icon-chevron-right"></i> Collapse</a> 

      </li> 
      <li><a href="#carousel"><i class="icon-chevron-right"></i> Carousel</a> 

      </li> 
      <li><a href="#typeahead"><i class="icon-chevron-right"></i> Typeahead</a> 

      </li> 
      <li><a href="#affix"><i class="icon-chevron-right"></i> Affix</a> 

      </li> 
     </ul> 

     </div> 
    </nav> 
    <section id="content" class="col-sm-9 col-md-9 col-lg-9 top-margin-20"> 
     <h3>content loop</h3> 
Sit ut wisi fuisset constituto, no quem munere nam. Ignota ornatus necessitatibus eu eos. Cum ut nibh habemus. Cu eos nisl graece, epicurei assentior ne usu, sea omnis prompta partiendo in. Oporteat consequuntur quo ea, ferri alterum pri eu. Ad eum oratio deterruisset, usu an detraxit disputationi. Nobis option ad eam. No vivendum honestatis mei. Aliquam alienum an mea, ad copiosae senserit moderatius nec. Ut sea virtute torquatos conceptam. Populo repudiandae te per. Ut denique consequuntur vel, at sea iisque appareat, te illum melius his. Diam graeco gubergren ex his. Sea in quem efficiantur, his agam sensibus ut, simul efficiantur cu nec. Latine nominati eam ex, unum debet ei eam. Amet doctus nec no, ne ipsum dicit nam. Cibo commodo reprimique sed ex. Sit ei intellegat scribentur, quot eligendi voluptaria vix an. In qui putent antiopam, laoreet admodum et mei. Dico vide oratio in pri, vel simul moderatius efficiantur te. Eam etiam falli ullamcorper ne, eu has cetero antiopam, et errem oportere vix. Nec justo movet recteque ea, ea vel ludus zril, has sumo animal ei. Vim erant gubergren similique ea, pro no ludus oblique. Ne natum tacimates reprehendunt mei, nostro scripta accumsan an eam. At tollit altera moderatius vel. Affert dolore duo at, ius quem pericula mediocritatem ea. Eum ipsum nulla mollis et, mei atqui menandri intellegam eu, qui ad malorum accumsan. Putant deleniti voluptatibus id eam, meis fastidii mnesarchum ea pri, te unum utroque eos. Cu case scriptorem pro. Est malis concludaturque te, an stet indoctum aliquando nec. Dicant tamquam ius et, et mei tantas recteque. Ne volutpat repudiare complectitur vix. Graeco electram omittantur at nec, bonorum dolorem maiorum est ne. Nec porro cetero indoctum ut, minim posidonium disputationi sed ei, iriure constituto his at. Oblique maiorum est ea. Quo habemus vituperata contentiones at, qui convenire imperdiet forensibus ei. Usu ferri disputationi ei, sonet repudiare hendrerit ut mea. Ex omnis utinam sit. Te eam facilis repudiare, vis inani moderatius ea, eu quot dicta sit. Congue facilisis eu sit, intellegam assueverit ei duo, te vix iusto laoreet persecuti. Discere percipit indoctum ei quo, praesent scribentur contentiones no vim, vix dicant nominati maluisset ei. Vim nullam omnesque singulis id, corpora petentium eos an. Cu vis legere animal, in nec ubique erroribus. In graecis intellegat constituto per, at suavitate forensibus conclusionemque mel. Qui in legere viderer posidonium, an sea nibh doming. Sed cu omittantur suscipiantur, no nam expetendis mediocritatem. Oblique aliquam cotidieque qui an, sit vidit solum postulant ad. Labores facilis ancillae ea mel, tale vivendo vis ad. Errem nostrum eum ex, ea est liber blandit, vide audiam ancillae id pro. Sea in saepe partem, quo ferri postea honestatis te. Nec tollit aperiri eu. Sit ut wisi fuisset constituto, no quem munere nam. Ignota ornatus necessitatibus eu eos. Cum ut nibh habemus. Cu eos nisl graece, epicurei assentior ne usu, sea omnis prompta partiendo in. Oporteat consequuntur quo ea, ferri alterum pri eu. Ad eum oratio deterruisset, usu an detraxit disputationi. Nobis option ad eam. No vivendum honestatis mei. Aliquam alienum an mea, ad copiosae senserit moderatius nec. Ut sea virtute torquatos conceptam. Populo repudiandae te per. Ut denique consequuntur vel, at sea iisque appareat, te illum melius his. Diam graeco gubergren ex his. Sea in quem efficiantur, his agam sensibus ut, simul efficiantur cu nec. Latine nominati eam ex, unum debet ei eam. Amet doctus nec no, ne ipsum dicit nam. Cibo commodo reprimique sed ex. Sit ei intellegat scribentur, quot eligendi voluptaria vix an. In qui putent antiopam, laoreet admodum et mei. Dico vide oratio in pri, vel simul moderatius efficiantur te. Eam etiam falli ullamcorper ne, eu has cetero antiopam, et errem oportere vix. Nec justo movet recteque ea, ea vel ludus zril, has sumo animal ei. Vim erant gubergren similique ea, pro no ludus oblique. Ne natum tacimates reprehendunt mei, nostro scripta accumsan an eam. At tollit altera moderatius vel. Affert dolore duo at, ius quem pericula mediocritatem ea. Eum ipsum nulla mollis et, mei atqui menandri intellegam eu, qui ad malorum accumsan. Putant deleniti voluptatibus id eam, meis fastidii mnesarchum ea pri, te unum utroque eos. Cu case scriptorem pro. Est malis concludaturque te, an stet indoctum aliquando nec. Dicant tamquam ius et, et mei tantas recteque. Ne volutpat repudiare complectitur vix. Graeco electram omittantur at nec, bonorum dolorem maiorum est ne. Nec porro cetero indoctum ut, minim posidonium disputationi sed ei, iriure constituto his at. Oblique maiorum est ea. Quo habemus vituperata contentiones at, qui convenire imperdiet forensibus ei. Usu ferri disputationi ei, sonet repudiare hendrerit ut mea. Ex omnis utinam sit. Te eam facilis repudiare, vis inani moderatius ea, eu quot dicta sit. Congue facilisis eu sit, intellegam assueverit ei duo, te vix iusto laoreet persecuti. Discere percipit indoctum ei quo, praesent scribentur contentiones no vim, vix dicant nominati maluisset ei. Vim nullam omnesque singulis id, corpora petentium eos an. Cu vis legere animal, in nec ubique erroribus. In graecis intellegat constituto per, at suavitate forensibus conclusionemque mel. Qui in legere viderer posidonium, an sea nibh doming. Sed cu omittantur suscipiantur, no nam expetendis mediocritatem. Oblique aliquam cotidieque qui an, sit vidit solum postulant ad. Labores facilis ancillae ea mel, tale vivendo vis ad. Errem nostrum eum ex, ea est liber blandit, vide audiam ancillae id pro. Sea in saepe partem, quo ferri postea honestatis te. Nec tollit aperiri eu.</div> 
</section> 
</div> 

И для JS это теперь просто

$('#affix_this').affix({ 
    offset: { 
     top: 260 
    } 
});