Hi,

I wonder if someone with a bit more knowledge than me could assist. I'm trying to implement 2 rows rather than 1 on the jcarousel - Firstly, is it possible to do so? And secondly, what would be the best way to do it?

I've searched high and wide and there seems to be a few posts on it but nothing concrete.

The method I'm currently using is to reduce the width of the container via css which has a desired effect, but with a downfall, it leaves the pre-calculated number of pages, so after half way of scrolling, you get a lot of empty pages.

You can see this in effect on the url below, if you click next a few times you can see the empty pages:
http://johnbretherton.com/site/views-video-template

Any help or guidance of any sort would be greatly appreciated.

Thank you.

Comments

kristofferrom’s picture

kristofferrom
He/him/his
CreditAttribution: kristofferrom commented

It seems like you got this working? Can you tell us how?

tky’s picture

tky CreditAttribution: tky commented

subscribed.

destinationsound’s picture

destinationsound CreditAttribution: destinationsound commented

also interested in finding out how you did this.
The site looks good!

markpavlitski’s picture

markpavlitski CreditAttribution: markpavlitski commented
Assigned: dariomem » Unassigned
satvision83’s picture

satvision83 CreditAttribution: satvision83 commented

The given link from the main post is not working. This one is working http://johnbretherton.com/site/drama-and-documentary and it's from the same website.
I can see that the author of this thread has managed to create jCarousel with two rows. Great job!

With firebug tool I can see that every li has

that is duplicated.

I hope someone will explain how to achieve this.

drupalfan4ever’s picture

drupalfan4ever CreditAttribution: drupalfan4ever commented

Does anybody know how to create two rows in jCarousel?

dariomem’s picture

dariomem CreditAttribution: dariomem commented

Hey Guys,

Sorry haven't been checking back!

Yes, I did achieve it but not entirely sure how as it was a while ago! Will log in tonight to check some of the code and give a bit of an explanation but essentially satvision83 is spot on, it is creating 2 li's. I think it was done either via the views interface or by (sorry!) hacking the jcarousel module to spew out two list items.

It is a bit crude to control in terms of placement, I struggled to get them to go chronologically left to right so
instead of displaying like this:
[a] [b] [c]
[d] [e] [f]

it renders like this:

[a] [c] [e]
[b] [d] [f]

But if that's not a deal breaker for some I will investigate this evening and post back. Sorry for the delay again.

satvision83’s picture

satvision83 CreditAttribution: satvision83 commented

@dariomem

I'm really glad that you're back and I'm looking forward to see more details for that nice jCarousel.

dariomem’s picture

dariomem CreditAttribution: dariomem commented

Hey guys,

Right, so I've had a look - I think the way I got it to work was to alter the jcarousel css in the modules folder.

Specifically I made the height of the clip bigger to say 600px.

.jcarousel-skin-default .jcarousel-clip-horizontal {
height: 600px;
overflow: hidden;
width: 794px;
}

I can't test it as I'm not on the machine with the files but just looking at the code I think that was what was done. It seems like the jquery will calculate the open space and fill it in (hence the lack of control with the ordering of thumbnails).

Let me know how you get on.

housser’s picture

housser CreditAttribution: housser commented

Hi,

I got some direction from this post (https://drupal.org/node/1668566), which led me to create a copy of the jcarousel-view.tpl.php, which looks like this:

<?php

/**
 * @file jcarousel-view.tpl.php
 * View template to display a list as a carousel.
 */
?>
<ul class="<?php print $jcarousel_classes; ?>">
  <?php foreach ($rows as $id => $row): ?>
    <? if(strpos($row_classes[$id],'odd')): ?>
      <li class="<?php print $row_classes[$id]; ?>">
    <?php endif; ?>

      <?php print $row; ?>

    <? if(strpos($row_classes[$id],'even')): ?>
      </li>
    <?php endif; ?>

  <?php endforeach; ?>
</ul>
jpstarter’s picture

jpstarter CreditAttribution: jpstarter commented
Issue summary: View changes

Did anyone get the multiple rows in jCarousel achieved, with spacing between rows? If so can you help me achieve the same Thanks in advance