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>& ...
随机推荐
- Vulnhub -- DC3靶机渗透
@ 目录 信息收集 尝试攻击 获取shell方法1 获取shell方法2 获取shell方法3 拿到root权限 拿FLAG 总结 信息收集 kali的ip为192.168.200.4,扫描出一个IP ...
- Mybatis学习笔记-缓存
简介 什么是缓存 **将一次查询的结果暂存至内存,后续查询只需查询缓存** 为什么使用缓存 **减少与数据库的交互次数,减少系统开销,提高系统效率** 什么样的数据能使用缓存 **经常查询且不常修改的 ...
- Python中strip()、lstrip()、rstrip()函数的用法
Python中使用函数strip().lstrip().rstrip()来剔除字符串前后的特定字符 函数语法为:str.strip(chars) 返回值是一个新的字符串,不更改源字符串 其中,参数ch ...
- 深度学习算子优化-FFT
作者:严健文 | 旷视 MegEngine 架构师 背景 在数字信号和数字图像领域, 对频域的研究是一个重要分支. 我们日常"加工"的图像都是像素级,被称为是图像的空域数据.空域数 ...
- CentOS 永久修改系统时间
1.查看当前系统时间 date 2.修改当前系统时间 date -s "2018-2-22 19:10:30 3.查看硬件时间 hwclock --show ...
- RHCE_DAY03
shell函数 在shell环境中,将一些需要重复使用的操作,定义为公共的语句块,即可称为函数(给一堆命令取一个别名) 函数可以使脚本中的代码更加简洁,增强易读性,提高脚本的执行效率 #函数定义格式1 ...
- pom.xml中web.xml is missing and <failOnMissingWebXml> is set to true错误的解决
.personSunflowerP { background: rgba(51, 153, 0, 0.66); border-bottom: 1px solid rgba(0, 102, 0, 1); ...
- [数据结构-平衡树]普通 FHQ_Treap从入门到精通(注释比代码多系列)
普通 FHQ_Treap从入门到精通(注释比代码多系列) 前提说明,作者写注释太累了,文章里的部分讲解来源于Oi-wiki,并根据代码,有部分增改.本文仅仅发布于博客园,其他地方出现本文,均是未经许可 ...
- Fluid + GooseFS 助力云原生数据编排与加速快速落地
前言 Fluid 作为基于 Kubernetes 开发的面向云原生存算分离场景下的数据调度和编排加速框架,已于近期完成了 v0.6.0 版本的正式发布.腾讯云容器 TKE 团队一直致力于参与 Flui ...
- 【笔记】numpy.array基础(3)
numpy数组的合并与分割 合并操作 concatenate拼接,只能操作维数一样的数据 且并不局限于两个元素 对于二维数组来说,可以通过控制axis来控制是按照行还是按照列来进行拼接操作,默认为ax ...