解决 table固定行和列,导致滚动条显示

实现了列固定,头部行固定

左侧,右侧两个div,左侧滚动,右着滚动,但是左侧会出现滚动条

使用鼠标滚动事件监听左侧

//滚动事件
        var scrollFunc = function (e) {
            e = e || window.event;
                if (e.wheelDelta == 120 || e.detail == -3) {
                    $(‘#cl_freeze‘).scrollTop($(‘#cl_freeze‘).scrollTop()-50);
                    $(‘#t_r_content‘).scrollTop($(‘#cl_freeze‘).scrollTop());
                    tablescroll();
                } else if(e.wheelDelta == -120 || e.detail ==  3 ) {

                   $(‘#cl_freeze‘).scrollTop($(‘#cl_freeze‘).scrollTop()+50);
                    $(‘#t_r_content‘).scrollTop($(‘#cl_freeze‘).scrollTop());
                    tablescroll();
                }
        };

        var cl_freeze = document.getElementById("cl_freeze");
        if (cl_freeze.addEventListener) {
            cl_freeze.addEventListener(‘DOMMouseScroll‘, scrollFunc, false);
        }
        cl_freeze.onmousewheel = scrollFunc;//IE/Opera/Chrome/Safari
时间: 2024-12-20 08:59:54

解决 table固定行和列,导致滚动条显示的相关文章

JavaScript遍历table的行和列

来源:http://blog.csdn.net/bobwu/article/details/7497412 1 <HTML> 2 <head> 3 <SCRIPT LANGUAGE="JavaScript"> 4 //遍历表格的每行每列 5 function viewCell() 6 { 7 var count=1; //在表格中显示的内容 8 for (i=0; i < document.all.tbl.rows.length; i++) {

html Table合并行和列

<!DOCTYPE html> <html> <head> <title>我的第四个页面</title> <meta charset=utf-8 > </head> <body> <table border="1" bordercolor="red" width="500" align="center" cellpadding

table 合并行和列

table合并行列,以及拆分 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"

HTML+CSS+JS实现TABLE固定列(常见浏览器兼容)的最佳实践

BS架构的企业级应用中,当一个表格列数较多时,用户一个常见的需求就是把前面几个重要的列固定住,这样拖动滚动条时固定的列会方便用户查看数据,用户体验很好.一些重量级的JS组件库也都有这个功能,那么有没有更简单的方法实现这个功能呢? 这个需求常见的解决方案是使用表格拼接的方法,这个方案如果要制作静态的网页,或者功能简单的动态页面,逻辑比较简单,技术上也不复杂,很容易实现,但是如果要做成组件,动态功能较多的话,就需要写大量的冗余代码,难以维护,甚至于一个简单的功能,都需要些很多的代码,比如事件处理等,

AngularJS进阶(二十八)解决AngualrJS页面刷新导致异常显示问题

解决AngualrJS页面刷新导致异常显示问题 绪 俗话说,细节决定成败,编程亦是如此.编程过程中我们可能会不自觉的忽视一些细节问题,殊不知,这些细节正是导致页面显示出现问题的地方.今略举一例,与君共勉之. 页面正常加载后,显示如下: 按F5刷新之后,页面如下所示: 很明显,页面显示出现了异常.回过头再看看Chrome的错误提示, 具体代码如下: 正是以上代码导致了错误的发生. 追根溯源 让我们回顾一下,错误到底是如何发生的.正常加载情况下,页面正常显示很容易理解,程序是按照既定的数据流走的.但

解决CsvWriter:中文乱码、末尾行多一行空格(/r)、非第一列空字符串&quot;&quot;显示null问题

一:主要内容 解决CsvWriter存csv,csv文件打开后中文乱码问题 解决CsvWriter存csv,csv文件最后一行总是多一行空行的问题 解决CsvWriter存csv,csv文件不是第一列的时候,想存入""即空字符串无法存入显示null的问题 二:解决问题前:需要做的事情 因为网上的CsvWrite的jar包导入到我们的工程中是class文件,针对上面的问题是无法修改源码的,但是我们又想用这个工具来操作csv,所以可以在自己的工程中首先pom引用这个jar包 <dep

table行转列

table行转列 摘要 在使用ews调用exhange的收件箱的并在h5页面显示邮件详情的时候,因为返回的每封邮件的内容都是htmlbody,没有textbody.每封邮件又没什么规律,用正则表达式来匹配内容并不合适,另外又要保持原邮件的格式.这个确实很难统一.目前是使用iframe标签,将原邮件的html在iframe中展示.但问题又来了,如果邮寄中有大表格,大图片,如何保持邮件内容自适应? 思考 通常的做法是在head中添加meta标签 <meta name="viewport&quo

报告一个IE很奇葩的滚动条问题——百分比计算宽度为浮点数时的滚动条显示异常

起因: 做项目的时候做了一个表格内容超过DIV容器自动横向滚动处理.别的浏览器都正常:但是在IE下面明明表格table和容器DIV宽度一致但是却出现了滚动条.如图 然后本人做实验找了半天原因终于是找到了,是IE浏览器使用百分比计算宽度值不是整数值引起的. 实例1:使用百分比计算结果是整数的情况下显示正常. <!DOCTYPE html> <html> <head> <meta charset='utf-8'> <title>IE8奇葩滚动条问题实

jquery实现行列的单向固定和列的拖拽

其实这些功能在PL/SQL Dev中都有实现,在页面中还是蛮常见的. 我实现列的单向固定的原理:将需要单向固定的列放在一个<table>标签中,而整体的数据放在另一个<table>标签中. 列的拖拽:使用onstartdrag.ondragover.drop事件 1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>table拖拽与行列固定</title> 5 <script sr