参考:http://code.ciaoca.com/jquery/kxbdmarquee/

 


版本:jQuery v1.3.<a href="http://www.koukousky.com/wp-content/uploads/2018/06/QQ截图201806271925511.png"><img class="alignnone size-medium wp-image-2034" src="http://www.koukousky.com/wp-content/uploads/2018/06/QQ截图201806271925511-566x300.png" alt="QQ截图20180627192551" width="566" height="300" /></a>2+
<ul class="release">
    <li><a class="demo" href="http://code.ciaoca.com/jquery/kxbdmarquee/demo/" target="_blank">查看 Demo</a></li>
    <li><a class="download" href="http://code.ciaoca.com/jquery/kxbdmarquee/version/jQuery.kxbdMarquee.zip">下载 jQuery kxbdMarquee</a></li>
</ul>
</div>

<div id="doc_menu" class="doc_menu">
<div class="title">文档目录</div>
<ol class="list">
    <li class="n">使用方法</li>
    <li>参数说明</li>
    <li>相关信息</li>
</ol>
</div>
<h2>使用方法</h2>
<div class="example">
<h3>载入 JavaScript 文件</h3>
<code class="lang">
<script src="jquery.js"></script>
<script src="jquery.kxbdmarquee.js"></script>

CSS 样式

/**
 * 父容器需要设置溢出隐藏
 * 如果是水平滚动,项目需要设置浮动
 */
#element_id{overflow:hidden;}
#element_id ul li{float:left;}
</code>
<h3>DOM 结构</h3>
<code>
<div id="element_id">
<ul>
    <li>...</li>
    <li>...</li>
    <li>...</li>
</ul>
</div>
<h3>JavaScript 调用方式</h3>
<pre><code class="js">$('#element_id').kxbdMarquee();</code></pre>
</div>
<h2>参数说明</h2>
<div class="example">
<table class="manual_table">
<thead>
<tr>
<th width="100">名称</th>
<th width="100">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td>direction</td>
<td>"left"</td>
<td>滚动方向。可设置为:"left", "right", "up", "down"</td>
</tr>
<tr>
<td>isEqual</td>
<td>true</td>
<td>所有滚动的元素长宽是否相等。可设置为:true, false</td>
</tr>
<tr>
<td>loop</td>
<td>0</td>
<td>循环滚动次数,0 表示无限循环</td>
</tr>
<tr>
<td>scrollAmount</td>
<td>1</td>
<td>步长(px)</td>
</tr>
<tr>
<td>scrollDelay</td>
<td>20</td>
<td>时长(ms)</td>
</tr>
</tbody>
</table>
</div>
<h2>相关信息</h2>

一个好用的JS 提示信息插件 noty

Github: https://github.com/needim/noty new Noty({ text: 'NOTY - a dependency-free notification library!', animation: { o...

阅读全文

chartjs —— jquery柱状图插件

官网地址: http://www.chartjs.org 文档:http://www.chartjs.org/docs/latest/charts/bar.html CDN: https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2....

阅读全文

简单功能强大的jQuery图片剪裁插件Image Cropper

引入必要的js和css核心文件 <script src="/path/to/jquery.js"></script><!-- jQuery is required --> <link href="/path/to/cropper...

阅读全文

评论已经关闭。