table头部固定,内容滚动,类似新闻一下向上滚动
html:
<div class="ul_box">
<table class="table1">
<thead>
<tr>
<th>11111111111</th>
<th>11111111111</th>
<th>11111111111</th>
<th>11111111111</th>
</tr>
</thead>
</table>
<div class="hide">
<table class="table2">
<tr>
<td>唐女士</td>
<td>137****2580</td>
<td>诊断:00****</td>
<td> 结果:<font class="red">持股待涨</font></td>
</tr>
<!-- 省略下面的..... -->
</table>
</div>
</div>
css:
.hide {
width: 1030px;
height: 150px;
overflow: hidden;
}
.table2 {
position: relative;
border-top: none;
border-bottom: none !important;
}
js:
var num = 0, timer3;
function table() {
timer3 = setInterval(function() {
// num 每行的高度
num += 20;
// if 里面的高度是要减去重复的高度
if(num == 300) {
num = 20;
$('.table2').css('top', 0 + 'px');
}
$('.table2').animate({top: -num+'px'}, 500,"linear",function (){});
}, 1000)
}
table();
table头部固定,内容滚动,类似新闻一下向上滚动的更多相关文章
- table头部固定,内容滚动
可以设置两个table,th,td得设置宽度: <table> <thead> <tr><th></th&g ...
- table表格固定前几列,其余的滚动
我查了好多资料,只找到一个demo <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""h ...
- jQuery div内容间隔1秒动态向上滚动HTML、JS代码
demo1: <!DOCTYPE html> <html> <head> <title>div内容间隔1秒动态滚动</title> < ...
- 实现html表头固定,表格内的信息向上滚动
效果如下: <!doctype html>Table header header two fuck 1 fuck 2 fuck 1 fuck 2 fuck 1 fuck 2 fuck 1 ...
- table头部、尾部固定;中间内容定高自适应滚动
table头部.尾部固定;中间内容定高自适应滚动 很多时候,需要使用到表格做数据分析,不管是前端展现,还是后台管理系统节点展现 工作过程中遇到了,作为一个小笔记,备忘! 如下图所示 --------- ...
- bootstrap table 实现固定悬浮table 表头并可以水平滚动
在开发项目中,需要将表格头部固定,而且表格大多数情况下是会水平滚动的.项目的css框架是bootstrap 3,故也可以叫做bootstrap table. 需要实现的是:表格头部固定,并且支持水平滚 ...
- 网页制作中在头部固定悬浮table表头(thead)的方法
这两天接了一个需求,页面是这样的 然后需求是页面中的这个表格当页面向上滚动,且表格的表头到达窗口上方时,表头悬浮在页面的上方,表格正常滚动,这样表格内的数据可以随时看到表头内容. 一开始我认为这是极简 ...
- 用js实现table内容从下到上连续滚动
网上有很多用ul实现新闻列表滚动的例子,但是很少有直接用table实现列表内容滚动的例子,而Marquee标签滚动的效果不是很好,于是就自己写了一个,提供给攻城师朋友们参考 实现思路:由于table包 ...
- div+css实现表头固定内容滚动表格
<div class="m-demo"> <table> <thead> <tr><th>定宽a</th>& ...
随机推荐
- 计算机网络模型和5G知识
目录 一.网络布线及信号传输 1.信号 2.传输介质 2.1双绞线 2.2光纤 2.3常见性问题 三.无线传播介质 四.综合布线系统 五.计算机的数制度以及运算 一.网络布线及信号传输 1.信号 频率 ...
- Top10 应用都在用的Android最新知识
相信各位对Jetpack并不陌生,自从 Google 在 2018 年推出 Jetpack 之后,它就成为了 Android 未来发展的指向标. 作为一名安卓工程师,我们以前会经常吐槽Android碎 ...
- 还怕问源码?Github上神级Android三方源码解析手册,已有7.6 KStar
或许对于许多Android开发者来说,所谓的Android工程师的工作"不过就是用XML实现设计师的美术图,用JSON解析服务器的数据,再把数据显示到界面上"就好了,源码什么的,看 ...
- markdown的摘要测试
123456789 1 123456789 2 123456789 3 123456789 4 123456789 5 123456789 6 粗体 123456 划线 123456 斜体 12345 ...
- SpringMVC学习05(整合ssm)
5.整合SSM 环境要求 环境: IDEA MySQL 5.7.19 Tomcat 9 Maven 3.6 要求: 需要熟练掌握MySQL数据库,Spring,JavaWeb及MyBatis知识,简单 ...
- 使用PageFactory类封装页面元素,并实现简单的登录
1.新建页面对象类LoginPage import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; impo ...
- 当任意文件上传偶遇Safedog
0x01 写在前面 渗透过程中可能会经常遭遇WAF,此时不要轻易放弃,绞尽脑汁竭尽全力,或许弹尽粮绝之时也是柳暗花明之日. 0x02 过狗上传 一次项目渗透过程中,找个一处上传功能 先上传图片,测试上 ...
- Android 9.0 默认输入法的设置流程分析
Android 输入法设置文章 Android 9.0 默认输入法的设置流程分析 Android 9.0 添加预置第三方输入法/设置默认输入法(软键盘) 前言 在上一篇文章 Android 9.0 ...
- deepin设置jdk全局变量
sudo vim /etc/bash.bashrc 在文件最后边添加 JAVA_HOME=jdk地址CLASSPATH=.:$JAVA_HOME/bin.tools.jarPATH=$JAVA_HOM ...
- NOIP 模拟 $30\; \rm 毛二琛$
题解 \(by\;zj\varphi\) 原题问的就是对于一个序列,其中有的数之间有大小关系限制,问有多少种方案. 设 \(dp_{i,j}\) 表示在前 \(i\) 个数中,第 \(i\) 个的排名 ...