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>& ...
随机推荐
- 两万字长文,彻底搞懂Kafka!
1.为什么有消息系统 1.解耦合 2.异步处理 例如电商平台,秒杀活动. 一般流程会分为: 风险控制 库存锁定 生成订单 短信通知 更新数据 通过消息系统将秒杀活动业务拆分开,将不急需处理的业务放在后 ...
- Esxi安装Kali2并开启远程桌面
Kali安装 登录Vmware Esxi页面,选择"创建/注册虚拟机",步骤和创建其它Linux主机类似(Esxi的安装和介绍可以参考上一篇文章) 不同的地方是,客户机操作系统版本 ...
- Spring Cloud Alibaba - Gateway
Gateway Gateway简介 底层使用Netty框架,性能大于Zuul 配置gateway模块,一般使用yaml格式: server: port: 80 #spring boot actuato ...
- Linux守护进程及Systemd
当我们启动一个前台任务后,命令行窗口退出,应用也就一起退出,无法访问了.怎么才能让它变成系统的守护进程(daemon),成为一种服务(service),一直在那里运行呢? 守护进程 前台任务和后台任务 ...
- 如何远程调试自定义开发的Flume应用
一.前言 Flume作为当下最流行的大数据采集组件之一.其本身拥有分布式/高可靠/高可用等优点,但相比较于Flink/Spark/Kafka等大数据组件,其对于本地调试的功能支持度并不高,如果我们没有 ...
- git常用命令究极记忆大法
第一点,我觉得也是最最重要的,就是明确git的三个区,工作区(working),暂存区(index),仓库(repository). 第二就是区与区之间的操作了. working与index之间: g ...
- Git(9)-- 远程仓库的使用
@ 目录 1.查看远程仓库:git remote 2.添加远程仓库:git remote add 3.从远程仓库中抓取与拉取:git fetch和 git pull 4.推送到远程仓库:git pus ...
- C#给线程传递数据
目录 0. 前情说明 1. ParameterizedThreadStart类型的委托 2. 使用自定义类 3. 使用Lambda表达式 4. 参考以及文中源代码下载 shanzm-2021年8月24 ...
- 【Azure 应用服务】App Service .NET Core项目在Program.cs中自定义添加的logger.LogInformation,部署到App Service上后日志不显示Log Stream中的问题
问题描述 在.Net Core 5.0 项目中,添加 Microsoft.Extensions.Logging.AzureAppServices 和 Microsoft.Extensions.Logg ...
- 题解 c(留坑)
传送门 这题卡常--而且目前还没有卡过去 首先以原树重心为根,向所有子树重心连边,可以建立一棵点分树 点分树有两个性质: 一个是树高只有log层 另一个是两点在点分树上的lca一定在原树上两点间的树上 ...