//给table 外层加一个div然后将divid传入方法,arr是一个数组里面填写需要固定的列数
function fixedCol(arr,divId){
var colArr = arr || [];
colArr.forEach(function(val){
$("#"+divId).scroll(function(){
var left = $("#"+divId).scrollLeft(); // 获取盒子滚动距离
var trs = $("#"+divId+" table tr"); // 获取表格所有的tr
// 获取每一行下面的td或者th,设置相对定位,偏移距离为盒子滚动的距离即 left
trs.each(function(i){
$(this).children().eq(val).css({"position":"relative","top":"0px","left":left,"background":"white"});
});
});
});
}
#spmx{
position: relative;
background: #fff;
z-index: 4;
}
#reyDiv{
z-index: 3;
}

$(document).ready(function(){
fixedCol([0,1,2],"spmx"); });
 

js 固定表头及固定列的js的更多相关文章

  1. JS+CSS - table 表格固定表头和第一列、内容可滚动 (转载)

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  2. table 表格固定表头和第一列、内容可滚动

    整理了下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" c ...

  3. 固定表头/锁定前几列的代码参考[JS篇]

    引语:做有难度的事情,才是成长最快的时候.前段时间,接了一个公司的稍微大点的项目,急着赶进度,本人又没有独立带过队,因此,把自己给搞懵逼了.总是没有多余的时间来做自己想做的事,而且,经常把工作带入生活 ...

  4. Saiku如何固定查询结果table的表头和首列

    在使用saiku查询的时候,当“行”和“列”的维度内容过多时,在查看时只看到数据,不知道是什么数据,维度不清楚,得来回拖动滚动条才行,所以同事提出想要固定“表头”和“首列”. 在网上找了一些现成的插件 ...

  5. 固定table的表头同时固定列

    table表格是我们最常使用的数据显示一种形式,但有时候数据比较多的时候 就需要我们去固定表头,固定列.我这里用简单的css样式配合两句js脚本来实现,希望能够去帮到你. <div class= ...

  6. H5手机开发锁定表头和首列(惯性滚动)解决方案

    前端时间移动端在做表格的时候需要这个功能,由于还有实现类似原生的惯性滚动功能,于是使用了iscroll插件. iscroll插件下载地址:iscroll5 该功能demo github地址: http ...

  7. jQuery 关于ScrollableGridPlugin.js(固定表头)插件的逐步解析

    以前写前台的时候需要用哪些效果从来都是有现成的东西拿来就用的,因为自己真的是有些懒,毫无探索精神,只重视结果,不追求过程. 这个ScrollableGridPlugin.js是从网上找到的一个具有固定 ...

  8. 关于JS、JQ首行首列固定展示

    当时遇见这个问题 是医院手麻系统大批量数据展示,由于是旧项目系统没有使用到前端的架构 只能使用JQ,JS, css完成 也谢谢给予我支持的同行们 固定首行数据: 采用函数的方式进行  JQ /** * ...

  9. js固定表头的实现(转)

    原文链接:http://www.th7.cn/web/js/201509/121055.shtml 参考链接:http://www.jb51.net/article/102568.htm 写两个表格, ...

随机推荐

  1. MVP 模式简单易懂的介绍方式

    为什么用Android MVP 设计模式? 当项目越来越庞大.复杂,参与的研发人员越来越多的时候,MVP 模式 的优势就充分显示出来了. MVP 模式是 MVC 模式在 Android 上的一种变体, ...

  2. C# Base64Helper

    public static class Base64Helper { /// <summary> /// base64字符保存图片到本 /// </summary> /// & ...

  3. 131.008 Unsupervised Learning - Principle component Analysis |PCA | 非监督学习 - 主成分分析

    @(131 - Machine Learning | 机器学习) PCA是一种特征选择方法,可将一组相关变量转变成一组基础正交变量 25 PCA的回顾和定义 Demo: when to use PCA ...

  4. linux 软件包安装方式选择、安装位置、源码包安装

    对外提供服务,比如apache,应使用源码包安装对内提供服务,比如gcc,只是我自己使用,使用rpm包安装 rpm包不需要指定安装位置,源码包的安装需要手动指定安装位置 rpm包默认安装位置/etc/ ...

  5. mysql 免安装版

    通过MySQL安装程序(.msi文件)来安装虽然简洁高效,但不够灵活,所以我们这里介绍免安装版. 1.  下载: 进入官网-->Downloads-->Community(社区版)--&g ...

  6. 《SQL Server 2008从入门到精通》--20180703

    SELECT操作多表数据 关于连接的问题,在<SQL必知必会>学习笔记中已经讲到过,但是没有掌握完全,所以再学一下. JOIN连接 首先我们先来看一下最简单的连接.Products表和Ve ...

  7. 解决eclipse 文件更新不自动刷新的问题

    打开eclipse 1. Window ===> Preferences ===> General ===> Workspace 2. 勾选 1> Refresh using ...

  8. 【MySQL】Linux下mysql安装全过程——小白入门篇(含有问题详解)

    本次安装操作在申请的腾讯云上实现(版本:CentOS Linux release 7.4.1708 (Core) ). 根据教程实现(中途各种挖坑,填坑...),地址:http://www.runoo ...

  9. 使用SharpZipLib压缩与解压文件

    using ICSharpCode.SharpZipLib.Zip; using System; using System.Collections.Generic; using System.IO; ...

  10. 使用linux远程登录另一台linux

    可以用ssh命令行方式登录.对方需要开启ssh服务.   ssh [-l login_name] [-p port] [user@]hostname   例如,使用root用户登录 192.168.0 ...