Views and JCarousel
thatashok - December 2, 2007 - 12:52
Has anyone gotten views and JCarousel working? I'm using imagefield and imagecache, and successfully have a view listing thumbnails attached to my nodes. I'd like to use the view in a block, with JCarousel. But its not scrolling (no error). Anyone have any joy with this?
=-=
your link points directly to jCarousel, are you using the jCarousel drupal module from the downloads area ?
I tried using the module,
I tried using the module, but that didn't help any.
Some more info: If I use the
Some more info:
If I use the simple example in a block:
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
vertical: true,
scroll: 2
});
});
</script>
<ul id="mycarousel" class="jcarousel-skin-tango">
<li><img src="http://static.flickr.com/66/199481236_dc98b5abb3_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/75/199481072_b4a0d09597_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/57/199481087_33ae73a8de_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/77/199481108_4359e6b971_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/58/199481143_3c148d9dd3_s.jpg" width="75" height="75" alt="" /></li>
<li><img src="http://static.flickr.com/72/199481203_ad4cdcf109_s.jpg" width="75" height="75" alt="" /></li>
</ul>
I have a scrolling carousel.
However, if I use the following in a block, no scrolling carousel:
<?php
$view = views_get_view('myview');
print views_build_view('block', $view, array(), false, 5)
?>
<script>
jQuery(document).ready(function() {
$("div.view-content-myview").find("ul").jcarousel({
vertical: true,
scroll: 2
});
});
</script>
Got it
After spending 15 min with the JCarousel module, and not having things working, I walked away from it. I have no idea if that would've solved the problem quicker/better. But here's the approach that's working for me:
- Unzipped JCarousel to my theme's folder
- installed http://drupal.org/project/jquery_update, http://drupal.org/project/views, http://drupal.org/project/cck, http://drupal.org/project/imagefield, http://drupal.org/project/imagecache
- Added the imagefield to my custom content type
- Created the imagecache thumbnail presets
- Created a view to use the thumbnails
- Included the view in a block
- Edited my theme's page.tpl.php to include the following in
<head>:<script type="text/javascript" src="<?php print base_path() . path_to_theme() ?>/jcarousel/lib/jquery.jcarousel.pack.js"></script><link rel="stylesheet" type="text/css" href="<?php print base_path() . path_to_theme() ?>/jcarousel/lib/jquery.jcarousel.css" />
<!--<link rel="stylesheet" type="text/css" href="<?php print base_path() . path_to_theme() ?>/jcarousel/skins/tango/skin.css" />-->
<link rel="stylesheet" type="text/css" href="<?php print base_path() . path_to_theme() ?>/tango-skin.css" />
<script type="text/javascript">
jQuery(document).ready(function() {
$("div.view-content-portfolio").find("ul").attr("id","jcarousel");
$("#jcarousel").addClass("jcarousel-skin-tango");
$("#jcarousel").jcarousel({
vertical: true,
scroll: 2
});
});
</script>
And I now have a scrolling jcarousel in my block.
i'll try that soon & let u
i'll try that soon & let u know. keep me up with if youre still trying to integrate thickbox.
thanks again.
it worked...but how to handle multiple carousels?
I followed your suggestion, even if i'm still using the module.
it worked perfectly but then i tried to show more than one carousel in a page using a function for each one. This is working only in firefox but not in Ie and opera.
They show only the first one cause only the first function works and add the right class to the ul inside a div.
I think there must be an elegant way to make it add classes to more than one div in a unique function but i don't know how...
Any idea?
thanks,
Da.
The short answer is jCarousellite
jCarousellite allows you to apply jcarousel effect to your views.
http://drupal.org/project/jcarousellite