0

So I have this bit of code and I tried putting it in .load and .ready functions but it just doesn't work because the carousel isn't fully loaded yet. 

var num_rec = "${recProducts.size()}";
if(num_rec < 5){
    jQuery(".jcarousel-prev").attr("disabled", true);
    jQuery(".jcarousel-next").attr("disabled", true);
    jQuery(".jcarousel-clip").attr("style", 'postion:relative; width:312px;');
}

Now this code runs, but is overridden by the carousel options. Is there an option for the carousel I can use that will run a function to run this code?

If I have only four things in my carousel then there is no need to show any paging because all four things will be displayed so I want to remove paging altogether and make the container a bit larger so that the picture doesn't cut off. If there are more than 4 though I need the paging.

1201ProgramAlarm
  • 32,384
  • 7
  • 42
  • 56
KacieHouser
  • 1,885
  • 4
  • 22
  • 35

3 Answers3

0

HA! I wrote an extra style to the actual stylesheet. This is not quite what I was looking for, but it works. Using the CSS visibility works because there is no inline style added to the element by the carousel plugin that uses it. 

if(num_rec < 5){                
    document.styleSheets[0].addRule(".pdp-main .recommendations .jcarousel-next", "visibility:hidden;");
    document.styleSheets[0].addRule(".pdp-main .recommendations .jcarousel-prev", "visibility:hidden;");
}

For FireFox you will have to use insertRule instead.

I would still like to know if there is a cleaner way to do this. The jQuery Rule plugin would not work for me.

KacieHouser
  • 1,885
  • 4
  • 22
  • 35
0

Simplified JQuery methd:

var total_items = jcarousel.find('li').length;
if(total_items < 5)
{                
    $('.jcarousel-control-prev, .jcarousel-control-next, .jcarousel-pagination').hide();
}
Laurence Cope
  • 403
  • 7
  • 20
0
  var items = $('.carousel-navigation').jcarousel('items');
  total_items=items.length;
  if(total_items < 5){                
    $('.prev-navigation, .next-navigation').hide();
  }
Verde
  • 45
  • 6
  • Although this code may help to solve the problem, it doesn't explain _why_ and/or _how_ it answers the question. Providing this additional context would significantly improve its long-term educational value. Please [edit] your answer to add explanation, including what limitations and assumptions apply. – Toby Speight Aug 23 '16 at 13:21