Drupal - Jcarousel and views

Adding a Jcarousel effect to a <ul> of a block view.

Install jquery_update module.

Download Jcarousel. Unzip to theme folder.

Create a block view, than publish it.

Add this snippet inside the <head> part of page.tpl.php:

   <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" />
    <script type="text/javascript">
jQuery(document).ready(function() {
$("div.view-class-name").find("ul").attr("id","jcarousel");
$("#jcarousel").addClass("jcarousel-skin-tango");
$("#jcarousel").jcarousel({
vertical: true,
scroll: 1
});
});
    </script>

List of options you may set

Via drupal.org forums. Posted here for reference.

By Diego on Tuesday, December 02, 2008

Thanx Mike!!!!

By Chloe on Friday, January 16, 2009

Thank you! This was a great, simple solution. Two minor problems though: 1 - the article doesn't say, but you need to change "div.view-class-name" to your own class name. It took me a few frustrated minutes to figure this out. 2 - you have to turn off the views hover links feature or else the hover links will get wrapped in the carousel, and the images wont. Otherwise, thanks a ton!