jQuery/Wordpress - How to integrate jCarousel to the NivoSlider Thumbs?
The base plugin I'm using is Nextgen Gallery. Then comes the Nextgen jSlider that adds nivo slider capabilities to the plugin. Only problem is that I need the thumbs to be inside a jCarousel. I've managed to modify the slider jquery script to put the images in an ul and to initialize the jcarousel.
Here's the code I put in the <head>
:
<script src="/wp-content/themes/twentyten/jquery.jcarousel.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="/wp-content/themes/twentyten/skin.css" type="text/css" media="all" />
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#navCarousel').jcarousel();
});
</script>
Here's the html code that is generated by the thumbnails nivo jquery script
<div class="nivo-controlNav" style="visibility: visible; ">
<ul id="navCarousel" class="jcarousel-skin-tango">
<li><a class="nivo-control" rel="0"><img src="/test/thumbs/thumbs_5.jpg" alt=""></a></li>
<li><a class="nivo-control" rel="1"><img src="/test/thumbs/thumbs_1.jpg" alt=""></a></li>
<li><a class="nivo-control" rel="2"><img src="/test/thumbs/thumbs_2.jpg" alt=""></a></li>
<li><a class="nivo-control" rel="3"><img src="/test/thumbs/thumbs_3.jpg" alt=""></a></li>
<li><a class="nivo-control active" rel="4"><img src="/test/thumbs/thumbs_4.jpg" alt=""></a></li>
</ul>
</div>
It kinda works when I save the page in my browser and open the local file again (the jquery is inactive though). Here's what it looks like when I do that: link
I'd appreciate any kind of input. Thanks.
If not, do you know of any othe开发者_JAVA百科r plugin that can do the same thing?
All the best, Cris
Try anyone among these:
http://www.dynamicwp.net/articles-and-tutorials/20-beautiful-wordpress-slideshow-plugins/
Awesome plugins specially for wordpress themes.
精彩评论