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>& ...
随机推荐
- [JS]异步任务之事件循环
前言 常常会听到单线程和多线程这两个名词,单线程即一个时间段内程序从上到下执行任务,多线程即一个时间段内程序同时执行多个任务. 然而 JavaScript 是单线程的,它不像 Java 那样新开启一个 ...
- JIPB | 两篇连发:华中农大黄俊斌团队报道二羟基异丁酰化调控稻曲病菌致病新机制
水稻是我国重要的粮食作物,稻曲病是水稻三大病害之一,不仅造成稻米产量损失,更重要的是稻曲球中的稻曲菌素的毒性和致畸作用,给人畜健康带来严重威胁.病原菌对植物的侵袭是由病原菌的毒力和植物免疫系统相互作用 ...
- 树莓派3B/3B+/4B 刷机装系统烧录镜像教程
树莓派3B/3B+/4B 刷机装系统烧录镜像教程 树莓派 背景故事 刚拿到树莓派的第一件事,应该就是要装系统了,那么应该怎么操作呢?下面就给大家介绍一下吧. 硬件准备 树莓派:3B/3B+/4B,本教 ...
- 记一次mysql事务未提交导致锁未释放的问题
记一次mysql事务未提交导致锁未释放的问题 ## 查看未提交的事务(3秒内未操作的事务) SELECT p.ID AS conn_id, P.USER AS login_user, P.HOST A ...
- 浅谈Java迭代器
迭代器Iterator 概述: 迭代器(Iterator):它不是一个容器,它是一种用于访问容器的方法,可用于迭代 List.Set和Map等容器. 迭代:一个一个的往外拿. 作用:帮我们遍历或者拿到 ...
- Notepad++的NppFTP插件连接linux操作系统
Notepad++的NppFTP插件连接linux操作系统 下载地址:https://notepad-plus-plus.org/downloads/v8.1.2/ 1.安装Npp_FTP插件 两种方 ...
- 特殊回文数 BASIC-9
特殊回文数 代码 import java.util.Scanner; /*123321是一个非常特殊的数,它从左边读和从右边读是一样的. 输入一个正整数n, 编程求所有这样的五位和六位十进制数, 满足 ...
- 基于SpringBoot的在线问卷调查管理系统
注意:该项目只展示部分功能,如需了解,评论区咨询即可. 1.开发环境 开发语言:Java 后台框架:SpringBoot 前端框架:vue 数据库:MySQL 设计模式:MVC 架构:B/S 源码类型 ...
- Android 9.0 BufferSlot注解
源码位置 /frameworks/native/libs/gui/include/gui/BufferSlot.h 源码 struct BufferSlot { BufferSlot() : mGra ...
- sqli-labs lesson 54-65
less 54 需要从数据库的CHALLENGES表中取出key值输入,输入对了才算通过,但是只能做10次尝试. 这里id被单引号包裹,注意闭合单引号即可,剩下的就可以参照less 1获取表中信息即可 ...