# jcarousel installation



## knightrider01 (Jun 10, 2010)

I am in the process of setting up a jcarousel slideshow for this page, and I want it to be in the style of the instructions on this page.

I am not very familiar with javascript at all, and to start with I am not sure I have the right information in the right spot in the header. Can you help me know what I should be doing differently to make this page work? Also, there should only be 3 pictures visible, with the arrows to allow people to scroll through the remaining pictures.

Help!


----------



## knightrider01 (Jun 10, 2010)

ok, I have made some changes (see post above for the actual page and the example page).

Here are my remaining issues:
1. The images won't scroll, and don't show the up and down arrows. What I want is to be able to scroll by moving the mouse or pressing the up and down button.
2. I would also like to find out how to turn the autoscrolling on and off, as I'm not sure I want it on there, but my client may ask for it later.

Can someone please help me? I'm desperate!


----------



## tomdkat (May 6, 2006)

knightrider01 said:


> 1. The images won't scroll, and don't show the up and down arrows. What I want is to be able to scroll by moving the mouse or pressing the up and down button.


In the CSS stylesheet, it looks as if the arrows have been disabled:

```
#slideshow-carousel li {  
    background:#fff;   
    height:178px;   
    position:relative;  
}  
  
[b][color=red]/* no arrow for now[/color][/b]
#slideshow-carousel li .arrow {  
    left:3px;   
    top:28px;   
    position:absolute;   
    width:20px;   
    height:40px;   
    background:url(images/arrow_white.png) no-repeat 0 0;   
    display:block;  
}  
[b][color=red]*/[/color][/b]

#slideshow-carousel li a {  
    background:#000;   
    display:block;   
    width:200px;   
    height:176px;  
}
```
Try removing the highlighted lines and see if the arrows come back. BE SURE to upload the arrow images to your server so they will be found by the browser and shown. 



> 2. I would also like to find out how to turn the autoscrolling on and off, as I'm not sure I want it on there, but my client may ask for it later.


From the jCarousel instructions, the option you want is in the jCarousel script:

```
//jCarousel Plugin  
    $('#carousel').jcarousel({  
        vertical: true, //display vertical carousel  
[b][color=red]        scroll: 1,  //auto scroll  [/color][/b]
        auto: 2,    //the speed of scrolling  
        wrap: 'last',   //go back to top when reach last item  
        initCallback: mycarousel_initCallback   //extra called back function  
    });
```
As for why the autoscrolling isn't working, that might be related to the arrows. Get the arrow code style rules reinstated first and see what happens.

Peace...


----------



## knightrider01 (Jun 10, 2010)

Thanks, Tom. I have the first issue figured out (different solution), and I tested it without the autoscroll item you highlighted, but it didn't remove it... Any more suggestions on how to remove the autoscroll?


----------



## tomdkat (May 6, 2006)

If the default for auto scroll is "on", *removing* that option won't be the correct action. Try setting the value to '0' (zero) to disable auto scrolling:


```
//jCarousel Plugin  
    $('#carousel').jcarousel({  
        vertical: true, //display vertical carousel  
        [b]scroll: [color=red]0[/color],  //auto scroll[/b]
        auto: 2,    //the speed of scrolling  
        wrap: 'last',   //go back to top when reach last item  
        initCallback: mycarousel_initCallback   //extra called back function  
    });
```
EDIT: Scratch the above. According to this jcarousel documentation, the "auto" parameter is the one you want to set:

```
//jCarousel Plugin  
    $('#carousel').jcarousel({  
        vertical: true, //display vertical carousel  
       scroll: 1,  // *** This is actually the SCROLL AMOUNT, not to control auto scrolling
        [b][color=red]auto: 0[/color][/b],    //the speed of scrolling  *** This controls auto scrolling
        wrap: 'last',   //go back to top when reach last item  
        initCallback: mycarousel_initCallback   //extra called back function  
    });
```
What did you end up doing for the first issue?

Peace...


----------

