Помогите пожалуйста. В JS вообще ноль.
Подключаю Slider Kit.
На выходе нужно получить 5 табов, в третьем - галерея.
В первом подключается хорошо, во втором и последующих - никак.
К сожалению, ссылку дать не могу - делаю на Denwer`е.
Библиотеку брал с официального сайта, на всякий случай - вложил архив в сообщение.
Код в head:
<!-- jQuery library -->
<script type="text/javascript" src="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/js/external/_oldies/jquery-1.3.min.js"></script>
<!--<script type="text/javascript" src="/assets/templates/v_1.0/ex/jquery.sliderkit.1.9.2t/js/external/jquery-1.6.2.min.js"></script>-->
<!-- jQuery Plugin scripts -->
<script type="text/javascript" src="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/js/external/jquery.easing.1.3.min.js"></script>
<script type="text/javascript" src="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/js/external/jquery.mousewheel.min.js"></script>
<!-- Slider Kit scripts -->
<script type="text/javascript" src="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/js/sliderkit/jquery.sliderkit.1.9.2.pack.js"></script>
<script type="text/javascript" src="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/js/sliderkit/addons/sliderkit.delaycaptions.1.1.pack.js"></script>
<script type="text/javascript" src="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/js/sliderkit/addons/sliderkit.imagefx.1.0.pack.js"></script>
<!-- Slider Kit launch -->
<script type="text/javascript">
$(window).load(function(){ //$(window).load() must be used instead of $(document).ready() because of Webkit compatibility
// Tabs > Imbricated
$(".tabs-imbricate").sliderkit({
cssprefix:"customtabs",
auto:false,
freeheight:true,
tabs:true
});
// Photo gallery > With captions
$(".photosgallery-captions").sliderkit({
mousewheel:true,
keyboard:true,
shownavitems:6,
auto:false,
delaycaptions:true
});
});
</script>
<!-- Slider Kit styles -->
<link rel="stylesheet" type="text/css" href="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/css/sliderkit-core.css" media="screen, projection" />
<link rel="stylesheet" type="text/css" href="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/css/sliderkit-demos.css" media="screen, projection" />
<!-- Slider Kit compatibility -->
<!--[if IE 6]><link rel="stylesheet" type="text/css" href="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/css/sliderkit-demos-ie6.css" /><![endif]-->
<!--[if IE 7]><link rel="stylesheet" type="text/css" href="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/css/sliderkit-demos-ie7.css" /><![endif]-->
<!--[if IE 8]><link rel="stylesheet" type="text/css" href="/assets/templates/v_1.0/ext/jquery.sliderkit.1.9.2/css/sliderkit-demos-ie8.css" /><![endif]-->
Код HTML:
<!-- Start of tabs-imbricate -->
<div class="customtabs tabs-imbricate">
<div class="customtabs-nav">
<div class="customtabs-nav-clip">
<ul>
<li><a href="#">Таб 1</a></li>
<li><a href="#">Таб 2</a></li>
<li><a href="#">Таб 3 с фотогалереей</a></li>
<li><a href="#">Таб 4</a></li>
<li><a href="#">Таб 5</a></li>
</ul>
</div>
</div>
<div class="customtabs-panels">
<div class="customtabs-panel">Lorem Ipsum 1</div>
<div class="customtabs-panel">Lorem Ipsum 2</div>
<div class="customtabs-panel">
<!-- Start photosgallery-captions -->
<div id="photosgallery-captions" class="sliderkit">
<!-- Start Навигация -->
<div class="sliderkit-nav">
<div class="sliderkit-nav-clip">
<ul>
<li><a href="#" rel="nofollow"><img src="/thumb-img1.jpg" /></a></li>
<li><a href="#" rel="nofollow"><img src="/thumb-img2.jpg" /></a></li>
<li><a href="#" rel="nofollow"><img src="/thumb-img3.jpg" /></a></li>
</ul>
</div>
<div class="sliderkit-btn sliderkit-nav-btn sliderkit-nav-prev"><a rel="nofollow" href="#" title="Previous line"><span>Previous line</span></a></div>
<div class="sliderkit-btn sliderkit-nav-btn sliderkit-nav-next"><a rel="nofollow" href="#" title="Next line"><span>Next line</span></a></div>
<div class="sliderkit-btn sliderkit-go-btn sliderkit-go-prev"><a rel="nofollow" href="#" title="Previous photo"><span>Previous photo</span></a></div>
<div class="sliderkit-btn sliderkit-go-btn sliderkit-go-next"><a rel="nofollow" href="#" title="Next photo"><span>Next photo</span></a></div>
</div>
<!-- // end of Навигация -->
<!-- Start Вывод img -->
<div class="sliderkit-panels">
<div class="sliderkit-panel">
<img src="/img1.jpg" />
<div class="sliderkit-panel-textbox">
<div class="sliderkit-panel-text">
<p>Описание картинки 1</p>
</div>
<div class="sliderkit-panel-overlay"></div>
</div>
</div>
<div class="sliderkit-panel">
<img src="/img2.jpg" />
<div class="sliderkit-panel-textbox">
<div class="sliderkit-panel-text">
<p>Описание картинки 2</p>
</div>
<div class="sliderkit-panel-overlay"></div>
</div>
</div>
<div class="sliderkit-panel">
<img src="/img3.jpg" />
<div class="sliderkit-panel-textbox">
<div class="sliderkit-panel-text">
<p>Описание картинки 3</p>
</div>
<div class="sliderkit-panel-overlay"></div>
</div>
</div>
</div>
<!-- // end of Вывод img -->
</div>
<!-- // end of photosgallery-captions -->
</div>
<div class="customtabs-panel">Lorem Ipsum 4</div>
<div class="customtabs-panel">Lorem Ipsum 5</div>
</div>
</div>
<!-- // end of tabs-imbricate -->