cssdiv在页面中纵向固定,不随滚动条滚动,横向随滚动条滚动

author author     2023-03-26     377

关键词:

纵向固定在左上角,横向可以滚动

可能会分3种情况:
1、浏览器的窗体滚动,这个估计每个浏览器都不一样,记得以前IE中纵向不超屏幕,横向超过一屏,用滚轮就横着滚,没测试。
2、iframe中的窗体滚动。
3、div中的内容overflow滚动。

1是随着屏幕分辨率计算,比较难控制。
2与3是可以用宽度高度控制,也可以由js判断初始化或者后续控制。

有了这些基础后,推荐使用js进行控制,当scroll的时候把y轴的变化转换到x轴上,根据以上情况的不同,控制好用户体验。追问

不明白

追答

试试理解吧,或者提出你的不明白之处。

参考技术A 你是说的背景吗?
position:flex
生成绝对定位的元素,相对于浏览器窗口进行定位。
参考技术B 使用position:flex;

如何固定table的第一行,不随纵向滚动条滚动,但能横向滚动

参考技术A*margin:0;padding:0;tdwidth:200px;line-height:30px;tablewidth:2000px;#thbackground-color:#888888;position:absolute;height:30px;top:0;left:0;#tbmargin-top:30px;</style><scripttype="text/javascript">varpre_scrollTop=0;//滚动条事件之前文档滚动高度varpre_s... 查看详情

如何让背景图片固定不随滚动条滚动

参考技术A1、打开html开发软件,新建一个html代码页面。2、在html代码页面的<body>标签里面输入多行段落文字,用于后面浏览器滚动条滚动的时候查看图片时候随滚动条而滚动条。如图3、设置背景图片样式。在<title>标签... 查看详情

div固定在页面左边,拖动横向滚动条依然在屏幕中页面的左边

如题,css实现div的悬浮处理,让他不随横向滚动条的拖动改变在屏幕中的位置额我的意思是这个div随这横向滚动条的向左右拖动也随着左右动,始终在屏幕的一个位置不消失.给个简单的小例子多谢因为IE6的兼容性问题,所以这不考... 查看详情

table怎么设置横向滚动条但纵向不要

对网页滚动条的控制,在细部上体现了页面的成功之处。特别是首页。如果精心设计的页面,需要在没有滚动条的情况下才能充分的展现,如果没有对滚动条进行很有效的控制,那别人看起来,一定会有很多遗憾。关于滚动条产... 查看详情

elementuitable首行固定

...求描述:首行固定,吸附在表头下,数据多时其他行可以纵向滚动 方案一 两个表格拼凑第一个表格展示头部和固定行第二个表格展示其它数据示意图如下 适用场景:仅横向纵向均无滚动条时可用若有横向滚动条,两... 查看详情

[前端][css]纯css实现纵向滚动固定表头与横向内容滚动

参考技术A这次要实现的目标是类似这种,纵向滚动时表头固定,横向滚动时,表头跟着滚动最基础的思路就是表头和内容是用两个表格来显示(图来自https://zhuanlan.zhihu.com/p/33280304),关于怎么保存表头和内容列宽一致链接里这... 查看详情

js或者jquery如何取得横向和纵向滚动条的最大可以滚动的值?

....append('width:'+$(document).width());3、浏览器运行index.html页面,此时会打印出界面最大可以滚动的文档宽度和文档高度。参考技术A  你好,要想得到滚动条的最大滚动的值,也就是说整个页面的最大宽度和高度,其中包括页... 查看详情

table左边固定-底部横向滚动条

是日有需求,曾探讨过table表单头部、尾部固定不动,中间内容随着滚动条的滚动而变化。整合资料之际,发现有很多表格,表单展现中,横向数据很多、很长,不方便查看。则,横空霹雳出了,此款:table表单左边固定,底部... 查看详情

在winform中,如何为datagridview设置横向滚动条

...有一个ScrollBars这里就是控制选项卡显示模式的.Both:横向,纵向都自动显示.None:不显示.Horizontal:只显示横向的.Vertical:只显示纵向的.参考技术A在默认情况下,滚动条会自动显示的,不需要设置,这样在宽度或高度不足时不出现滚动... 查看详情

html代码中如何用position属性来固定一个div模块的位置,让其不随滚动条移动?

我想在网页页面两侧添加一个悬浮窗口,使用的是fixed属性,但是我不希望它能随滚动条移动,而是固定在这个页面的某一位置,该怎么去弄,要用什么属性完成?求高手解答!要想div固定在一个位置,可以使用css中的绝对定位... 查看详情

有两个div,一个父级,一个子级,父级有滚动条,样式如何写才能让子级的div固定在顶部,不随滚动条

...,一个子级,父级有滚动条,样式如何写才能让子级的div固定在顶部,不随滚动条滚动参考技术A父级加上position:relative;子集加上:position:absolute;top:0;本回答被提问者和网友采纳 参考技术B可以加上margin-top:0; 参考技术C绝对定... 查看详情

解决ext4.0.7tree.panel横向不出滚动条,纵向滚动条失效的问题

/***重写Ext.tree.Panelafterlayout方法,解决横向不出滚动条,纵向滚动条失效的问题*1.显示grid的css滚动条,横向滚动条没有办法使标题一块儿滚动,所以隐藏掉*2.将grid的css纵向滚动条定位到最右侧*3.获取到ext自动添加的自己写的滚... 查看详情

jq如何判断横向滚动条到最右侧

...来判断的,如果前后值没有变就是横向滚动了,  但是页面里有多个滚动条,就要多个全局变量来控制,该怎么判断呢?  scrolljquery区分横向纵向滚动条  解决方法:  each一次设置选择器选中对象的scrollLeft/scrollTop就行... 查看详情

可以为纵向和横向设置不同大小的滚动条吗?

】可以为纵向和横向设置不同大小的滚动条吗?【英文标题】:It\'spossiblesetdifferentsizeascrollforportraitandlandscapeorientation?【发布时间】:2014-08-0702:58:00【问题描述】:可以为纵向和横向设置不同大小的卷轴吗?示例:纵向:x500y568... 查看详情

table固定表头固定列实现横向纵向滚动

参考技术A大致思路是:建立两个table,一个table里只有thead,一个table里只有tbody,分别把两个table用div包裹起来,设置有tbody的div固定高度,超出overflow:scroll;至于横向滚动的问题,可以设置position:sticky,然后根据左右浮动的个数... 查看详情

怎么用css给html加横向滚动条并且隐藏竖向滚动条

最好能使竖向显示的页面也弄成横向显示的页面!求CSS代码!!~需要准备的材料分别有:电脑、浏览器、html编辑器。1、首先,打开html编辑器,新建一个html文件,例如:index.html。2、在index.html中的<body>标签中,输入样式代码:s... 查看详情

js设置横向滚动条

窗口缩小后就这样了,我想给页面设置一个窗口缩小后自动出现的横向滚动条,求大神指教。参考技术A用不着js,给最外层的div加一个min-width就可以了,这样设置后当页面屏宽度缩小后,会自动出现滚动条。追问给body吗?追答XX... 查看详情

滚动条在 IOS APP 中未以横向模式显示

...布时间】:2013-05-1007:50:20【问题描述】:我想制作横向和纵向模式的iOS应用。我设计了一页有3个文本框和7个按钮。文本框和按钮在横向模式下根据IOS屏幕大小调整大小(更改宽度),但滚动条在横向模式下不显示。因此,某些... 查看详情