I have a view (block) with 4 images that I have set as

Style: Views Carousel ;
Row Style: Fields;
Grouping:None;
Skin: Tango;
Start:1;
Offset:1;
Scroll: 3;
Visibility: true;
animation:fast;
Easing: null;
Autoscrolling: 0 ;
Wrap:Circular.

Preview of the view in Views shows all 4 images.

I have set the following in my .css

#block-views-frontpageslideshow-block_1 .jcarousel-item-horizontal {
  width: 300px;
  height: 280px;
}
#block-views-frontpageslideshow-block_1 .jcarousel-clip-horizontal {
  width: 900px;
  height: 280px;
}
#block-views-frontpageslideshow-block_1 .jcarousel-container-horizontal {
  width: 932px;
  height: 280px;
}

I get the first slide appearing in the block but the buttons don't work. Here is what I see in the page source:

<div class="jcarousel-container jcarousel-container-horizontal" style="display: block; ">
  <div class="jcarousel-prev jcarousel-prev-horizontal jcarousel-prev-disabled jcarousel-prev-disabled-horizontal"
      style="display: block; " disabled="true">
  </div>
  <div class="jcarousel-next jcarousel-next-horizontal jcarousel-next-disabled jcarousel-next-disabled-horizontal" 
      style="display: block; " disabled="true">
  </div>
  <div class="jcarousel-clip jcarousel-clip-horizontal">
      <ul id="viewscarousel-frontpageslideshow-block-1" class="jcarousel-processed jcarousel-list 
             jcarousel-list-horizontal" style="width: 3600px; ">
         <li class="jcarousel-item jcarousel-item-horizontal jcarousel-item-1 jcarousel-item-1-horizontal" 
             jcarouselindex="1" style="width: 890px; ">  
            <div class="views-field-field-image-fid">
               <span class="field-content"><img class="imagefield imagefield-field_image" width="929" 
                  height="281" alt="" 
                  src="xxxx">
               </span>
            </div>
          </li>
          <li ...   (3 more similar

Any ideas of why both the next and prev buttons are disabled?

Comments

pschopf’s picture

pschopf commented

OK, so now it is working.

I found from the Inspector that there was an error with another block of javascript (with no apparent relation to the carousel). When I fixed that in the template file, the carousel started working.

In short, it appears that the module(s) are working fine, but advice to everyone to check the status of the page load before worrying about jquery related problems.

I think this should be closed.

powan’s picture

powan commented

I have the same problem with pev and next buttons not working. Probably related, auto scroll does not work either.

I just re-installed jCarousel and Views Carousel on a brand new site using theme Garland in case something in my original site was causing a conflict. No luck. I have been working with CSS some to get the sizing adjusted. Nothing makes a difference. jcarousel-prev and jcarousel-next have disabled="true". I don't know if that is significant but I see no way to change to "false."

relevant modules:
Drupal 6.16
Views 6.x-2.8
Views Carousel 6.x-2.x-dev
jCarousel 6.x-1.1

Just for grins, I managed to add javascript to a page using jCarousel alone. This time I could see all my images but there were no prev and next buttons.

kershin’s picture

kershin commented

Hello there,

If someone still needs a workaround..

A solution i found is changing the .jcarousel-item width in the css sheet (use the same value than your img width).

For example:

.jcarousel-item { width: 150px; }

It should work