HTML代码CSS代码JS代码

<div class="text" id="text">
<ul class="sliderbox">
<li><a href="">测试文字1滚动Lorem ipsum dolor sit1.</a></li>
<li><a href="">测试文字2滚动Lorem ipsum dolor sit2.</a></li>
<li><a href="">测试文字3滚动Lorem ipsum dolor sit3.</a></li>
<li><a href="">测试文字4滚动Lorem ipsum dolor sit4.</a></li>
<li><a href="">测试文字5滚动Lorem ipsum dolor sit5.</a></li>
<li><a href="">测试文字6滚动Lorem ipsum dolor sit1.</a></li>
<li><a href="">测试文字7滚动Lorem ipsum dolor sit2.</a></li>
<li><a href="">测试文字8滚动Lorem ipsum dolor sit3.</a></li>
<li><a href="">测试文字9滚动Lorem ipsum dolor sit4.</a></li>
<li><a href="">测试文字10滚动Lorem ipsum dolor sit5.</a></li>
<li><a href="">测试文字11滚动Lorem ipsum dolor sit1.</a></li>
<li><a href="">测试文字12滚动Lorem ipsum dolor sit2.</a></li>
<li><a href="">测试文字13滚动Lorem ipsum dolor sit3.</a></li>
<li><a href="">测试文字14滚动Lorem ipsum dolor sit4.</a></li>
<li><a href="">测试文字15滚动Lorem ipsum dolor sit5.</a></li>
</ul>
</div>

.sliderbox{position:relative;}/*必须加这句css,否则向左右，上下滚动时会没有效果*/
.text{height:150px; width:200px; overflow: hidden; position: relative; margin:0px auto;}
.text li{line-height:30px; height: 30px; width: 200px; white-space: nowrap; overflow: hidden; text-overflow:ellipsis;}

$("#text").powerSlider({delayTime:1000,sliderNum:5});
//$("#text-left").powerSlider({handle:"left",delayTime:2000,sliderNum:5});
$("#text-hide").powerSlider({handle:"hide",delayTime:3000,sliderNum:5,speed:0});
//$("#text-fadeTo").powerSlider({handle:"fadeTo",delayTime:4000,sliderNum:5});
$("#text-slideTo").powerSlider({handle:"slideTo",delayTime:5000,sliderNum:5});//请对照相应的对象写相应的动作。