文档章节

单行文字滚动

0000001
 0000001
发布于 2014/06/17 15:06
字数 125
阅读 231
收藏 1
点赞 0
评论 0

function AutoScroll(obj){

$(obj).find("li:first").animate({

marginTop:"-36px"

},500,function(){

$(this).css({marginTop:"0px"}).find("li:first").appendTo(this);

});

}

$(function(){

setInterval('AutoScroll("#scroll")',2000)

});


css: scroll-box li{ height:36px; line-height:36px; }

<div class="scroll">

<ul class="scroll-box" id="scroll">

<li>scroll</li>

<li>scroll</li>

<li>scroll</li>

<li>scroll</li>

</ul>

</div>


//多行滚动

$(function(){

var _wrap=$('ul.notice-hd');//定义滚动区域

var _interval=3000;//定义滚动间隙时间

var _moving;//需要清除的动画

_wrap.hover(function(){

clearInterval(_moving);

},function(){

_moving=setInterval(function(){

var _field=_wrap.find('li:first');

var _h=_field.height();

_field.animate({marginTop:-_h+'px'},600,function(){

_field.css('marginTop',0).appendTo(_wrap);

})

},_interval)

}).trigger('mouseleave');

});


© 著作权归作者所有

共有 人打赏支持
0000001
粉丝 35
博文 141
码字总数 46256
作品 0
朝阳
前端工程师
Android 自定义跑马灯

前言 最近公司接到需求--「可以滚动的提示」,其实就是跑马灯。这让我想到了大学时专业物联网,当时学的单片机入门教程就是跑马灯,很是亲切。其实就是灯(或文字)按照某个方向循环滚动。 An...

下位子
2017/12/26
0
0
css杂类收集

单行不换行显示 需要设置宽度/或者最大宽度 width:xxxpx;overflow:hidden;white-space:nowrap;text-overflow:ellipsis; 如果想要设计input 输入框的边框格式 需要手动添加边框 border:1px s...

bosscheng
2015/10/21
83
0
使用css3和js在手机上实现简单的跑马灯效果

情况描述 客户想在手机顶部的nav显示单行文字时,在字数较多,一屏显示不下的情况下,文字可以滚动起来.一开始,我是用的php做了一下字数的判断,如果字数比10个多就添加一个

小王JOJO
2016/07/02
17
0
微信小程序特殊效果合集—左滑、气泡各种酷炫动画

微信小程序的开发并不难,但是有时我们想做出比较炫的效果,可能会一时没有思路或找不到方法。下面就整理了微信小程序的一些特殊效果的案例,均来自网络,供你参考。 1、文字跑马灯效果:htt...

anda0109
2017/08/08
0
0
[翻译]Windows Phone 7 Application Controls

前言-关于这段译文 Windows Phone开发的中文资料缺乏,这段译文翻译自《UI Design and Interaction Guide for Windows Phone 7 Series》,翻译活动由http://www.wpmind.com/ 的站长小指发起,...

长平狐
2012/08/21
241
0
Emacs 26.1 发布了,文字终端支持 24 位颜色

Emacs 26.1 发布了,此次更新内容包括: 内置的 Lisp 线程机制,它提供了一些并发性 支持在缓冲区中可选显示行号 在 X Window 系统下运行时双缓冲 重新设计的 Flymake 模式 TRAMP 为 Google...

雨田桑
05/29
0
0
让TextView显示的文字一跑马灯显示属性设置

<TextView 一定要设置单行显示 android:singleLine="true" , android:ellipsize="marquee"就是跑马灯属性,android:marqueeRepeatLimit="marquee_forever"为一直都是滚动模式 Activity里面还......

放纵的青春
2015/07/03
0
0
python核心编程--第十九章

19.2 Tkinter与python编程 19.2.1 Tkinger模块:把Tk引入您的程序 要创建并运行您的GUI程序,下面五步是基本的: 1. 导入Tkinter模块 2. 创建一个顶层窗口对象,来容纳您的整个GUI程序 3. 在...

fzyz_sb
2013/06/23
0
1
html实现滚动,但兼容不是很好(转载的)

4.3.1 设置文字滚动 HTML技术中使文字滚动的方法是使用双标签 。在HTML代码中可使其作用区文字滚动,默认为从右到左,循环滚动。在D:web目录下创建网页文件,命名为mar.htm,编写代码如代码4...

如风般魅影
2014/03/19
79
0
OCR技术浅探 : 文字定位和文本切割(2)

文字定位 经过前面的特征提取,我们已经较好地提取了图像的文本特征,下面进行文字定位。 主要过程分两步: 1、邻近搜索,目的是圈出单行文字; 2、文本切割,目的是将单行文本切割为单字。 ...

iamdll
01/31
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

eclipse SVN 项目重新定位

SVN 重新定位 1.方法一 首先:在Eclipse中选择Windows-> Show View->others 就会出现【SVN资源库/SVN Repositories】,选中后,点击确认; 然后:选中原有的地址,选择【重新定位/Relocate】...

qimh
13分钟前
0
0
Linux 第29课 ——Linux集群架构(下)

Linux集群架构(下) 八、DR模式搭建 8.1 准备工作 试验需求三台机器: 分发器,也叫调度器(简写为dir) 192.168.112.136 ying01 rs1 192.168.112.138 ying02 rs2 192.168.112.139 ying03 vip...

feng-01
18分钟前
0
0
轻松搭建svn版本管理工具+svnmanager管理客户端

前面的文章有写过svn版本管理工具的安装是基于svn的安装包进行安装,对于svn与apache的结合还得下svn和apache的模块进行结合过程比较繁琐,今天来介绍下通过centos的yum来安装svn能够快速安装...

javazyw
27分钟前
0
0
keepalived配置高可用集群

Linux集群概述 根据功能划分为两大类:高可用和负载均衡 高可用集群通常为两台服务器,一台工作,另外一台作为冗余,当提供服务的机器宕机,冗余将接替继续提供服务 实现高可用的开源软件有:...

TaoXu
32分钟前
0
0
mysql联表批处理操作

1 概述 mysql中的单表增删改查操作,可以说是基本中的基本. 实际工作中,常常会遇到一些基本用法难以处理的数据操作,譬如遇到主从表甚至多级关联表的情况(如一些历史问题数据的批量处理),考虑到...

社哥
35分钟前
0
0
IntelliJ IDEA 详细图解最常用的配置,适合刚刚用的新人。

刚刚使用IntelliJ IDEA 编辑器的时候,会有很多设置,会方便以后的开发,磨刀不误砍柴工。 比如:设置文件字体大小,代码自动完成提示,版本管理,本地代码历史,自动导入包,修改注释,修改...

kim_o
50分钟前
0
0
Google Java编程风格指南

目录 前言 源文件基础 源文件结构 格式 命名约定 编程实践 Javadoc 后记 前言 这份文档是Google Java编程风格规范的完整定义。当且仅当一个Java源文件符合此文档中的规则, 我们才认为它符合...

niithub
52分钟前
0
0
java.net.MalformedURLException异常说明

1.异常片段 Java代码中,在进行URL url = new URL(urllink)操作时,提示以下异常信息,该类异常主要问题出在参数urllink上面。 异常片段1 java.net.MalformedURLException at java.ne...

lqlm
52分钟前
1
0
CentOS7修改mysql5.6字符集

解决办法:CentOS7下修改MySQL数据库字符编码为UTF-8,UTF-8包含全世界所有国家所需要的字符集,是国际编码。 具体操作如下: 1.进入MySQL [root@tianqi-01 ~]# mysql -uroot -p Enter passw...

河图再现
54分钟前
0
0
DevExpress v18.1新版亮点——WPF篇(一)

用户界面套包DevExpress v18.1日前终于正式发布,本站将以连载的形式为大家介绍各版本新增内容。本文将介绍了DevExpress WPF v18.1 的新功能,快来下载试用新版本!点击下载>> Accordion Co...

Miss_Hello_World
56分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部