Heim > Web-Frontend > HTML-Tutorial > 如果做类似Excel 冻结首列的效果_html/css_WEB-ITnose

如果做类似Excel 冻结首列的效果_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 11:48:08
Original
1415 Leute haben es durchsucht

我有一个table  ,数据是动态读取的,现在想把前面四列做成类似Excel 冻结的效果,
拖动 横向的滚动条的时候,这四列固定不动,各位有什么思路没有。

如果把这四列提出来到一个独立的DIV,势必会破坏原来的数据结构,而且,我这个页面数据很多,炒鸡复杂,所以希望有个改动量最小的解决方案。


回复讨论(解决方案)

Duang!~ Duang!~ Duang!

Duang!~ Duang!~ Duang!


圆圆,你好啊

做两个table啊,固定不动的四列做一个table放左边,可以动的一个table放右边,溢出隐藏也设到右边,这样右边滚动就不会影响左边。
动态读取到数据时两个table同时往下加行就行了。

把需要懂的用大的div包裹起来,设置width, overflow-x:scroll。

做好标记就可以

<table><tr>    <td class='budong'></td>    <td></td>    <td></td>    <td></td>    <td></td></tr></table>
Nach dem Login kopieren
Nach dem Login kopieren

然后拖动的时候判断class值 就可以! 首先把td的复制一份! 其实原来的td还是滚的 不过把新的复制的这个设置成固定位置!

做好标记就可以

<table><tr>    <td class='budong'></td>    <td></td>    <td></td>    <td></td>    <td></td></tr></table>
Nach dem Login kopieren
Nach dem Login kopieren

然后拖动的时候判断class值 就可以! 首先把td的复制一份! 其实原来的td还是滚的 不过把新的复制的这个设置成固定位置!

 说的挺靠谱的,能不能贴下JS代码。怎么把新的固定。详细点说嘛,大婶

把需要懂的用大的div包裹起来,设置width, overflow-x:scroll。


你这个太投机取巧了。

jQuery EasyUI 数据网格 - 设置冻结列

http://download.csdn.net/detail/qq_26505177/8494335

 才上传的插件,看看能帮到你不。


把需要懂的用大的div包裹起来,设置width, overflow-x:scroll。


你这个太投机取巧了。


如果数据量太庞大,用插件复写麻烦的话。 

就看看 初始版 ,那个可以很容易的简写~不够傻瓜式。
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage