Navigation autoslide problem with coda-slider 2.0
2 min read
If you want your navigation panel outside the coda wrapper you need to edit a bit the source code.
As an example of what you may want, let's assume the code below.
Then to make it works, change the line #220
with the following:
Keep in mind that your navigation may have an ID like "coda-nav-1", and your slider wrapper should have an ID of "coda-slider-1".
As an example of what you may want, let's assume the code below.
<div class="coda-slider-wrapper">
<div class="coda-slider preload" id="coda-slider-1">
<div class="panel">
<div class="panel-wrapper">
panel 1
</div>
</div>
<div class="panel">
<div class="panel-wrapper">
panel 2
</div>
</div>
<div class="panel">
<div class="panel-wrapper">
panel 3
</div>
</div>
</div><!-- .coda-slider -->
</div><!-- .coda-slider-wrapper -->
<div id="coda-nav-1" class="coda-nav">
<ul>
<li class="tab1">nav 1</li>
<li class="tab2">nav 2</li>
<li class="tab3">nav 3</li>
</ul>
</div>
Then to make it works, change the line #220
slider.siblings('.coda-nav').find('a').removeClass('current').parents('ul').find('li:eq(' + (currentPanel - 1) + ') a').addClass('current');
with the following:
$('.coda-nav').find('a').removeClass('current').parents('ul').find('li:eq(' + (currentPanel - 1) + ') a').addClass('current');
Keep in mind that your navigation may have an ID like "coda-nav-1", and your slider wrapper should have an ID of "coda-slider-1".