Hi,
Please take a look at the css file: pausing_up_down_scroller.css. The original content was
| Code: |
#pscroller1{
width: {$width};
height: {$height};
border: 1px solid #9A9A9A;
padding: 5px;
background-color: lightyellow;
}
#pscroller2{
width: 240px;
height: 60px;
border: 1px solid #9A9A9A;
padding: 5px;
background-color: #DDFEE9;
}
#pscroller3{
width: 350px;
height: 17px;
border: 1px solid #dddddd;
padding: 3px;
}
|
From the css, you will know that #pscroller1, #pscroller2 and #pscroller3 refers to unique id. That's the reason why when you use two pscroller1, it won't work. It has to be unique id for each scroller.
If you want multiple instance of pscroller1, all you need to do is to make pscroller2 and pscroller3 css definitions the same as pscroller1, as illustrated below:
| Code: |
#pscroller1{
width: {$width};
height: {$height};
border: 1px solid #9A9A9A;
padding: 5px;
background-color: lightyellow;
}
#pscroller2{
width: {$width};
height: {$height};
border: 1px solid #9A9A9A;
padding: 5px;
background-color: lightyellow;
}
#pscroller3{
width: {$width};
height: {$height};
border: 1px solid #9A9A9A;
padding: 5px;
background-color: lightyellow;
}
|
Make sure you use id:pscroller1 for scroll1, id:pscroller2 for scroll2, and id:pscroller3 for scroll3.
Regards,
/kksou