您的位置:首页 - jQuery
单行文字滚动就用myslider

单行文字滚动就用myslider,myslider是一个小型的内容滚动jquery插件。

首先请看实例:http://keleyi.com/jq/myslider/demo/4.htm

然后来看代码:

<script type="text/javascript" src="http://keleyi.com/keleyi/pmedia/jquery/jquery-1.11.1.min.js"></script>
<link href="http://keleyi.com/jq/myslider/css/jquery.myslider.0.1.3.css" type="text/css" rel="Stylesheet" />
<script type="text/javascript" src="http://keleyi.com/jq/myslider/js/jquery.myslider.0.1.3.js"></script>

<div id="myslider_keleyi_com" class="keleyimyslider">
<ul>
<li>This is a myslider demo.
</li>
<li><a href="http://keleyi.com/jq/myslider/">myslider home</a></li>
<li><a href="http://keleyi.com/">Keleyi Home</a></li>
<li><a href="http://keleyi.com/keleyi/">Keleyi Menu Home</a></li>
<li><a href="http://plugins.jquery.com/myslider/">jquery plugin myslider</a></li>
<li>
http://keleyi.com/jq/myslider/ </li>
</ul>
</div>

<script type="text/javascript">
$("#myslider_keleyi_com").myslider({ "width": "500px"
, "millisec": "2000"
, "animatespeed": 800
, "fontSize": "20px"
, "li_style": {"font-size":"20px"}
});
</script>


从上面代码可以看到,实现单行文字滚动很简单,只需引用js文件和css件,然后构造滚动内容的html,最后是使用javascript的语句实现滚动,javascript语句可以设定滚动的方向(上或下),间歇时间,等等参数。可以看到html语句也是很简单的,记得div要加 class="keleyimyslider" 。

当然,myslider插件也可以实现多行内容的滚动,还可以是图片的滚动,详情请参考http://keleyi.com/jq/myslider/
本站导航
相关文章
柯乐义 Copyright© keleyi.com