DIV固定不动，不随滚动条滚动且不闪动

最新推荐文章于 2020-06-22 16:19:29 发布
最新推荐文章于 2020-06-22 16:19:29 发布
阅读量877 收藏
点赞数
分类专栏： js 文章标签： div 固定不动
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/iteye_11116/article/details/82547367
版权

<!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>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>chinmo.net</title>

<style type="text/css">

body{

 margin:0px;

 padding:0px;

}

#glideDiv0{position:fixed; top:0;left:0; width:100%; background:#F00;}

</style>

<!--[if IE 6]> 

<style type="text/css">

html{overflow:hidden;}

body{height:100%;overflow:auto;}

#glideDiv0{position:absolute;}

</style>

<![endif]-->

</head>

<body>

<div id="glideDiv0">

固定顶部不动

</div>

<div id="wrap_outer">

<br/><br/>固定Div,且scroll时Div不闪动。

<br/><br/>

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

<br/><br/>aaaa

</div>

</body>

</html>

iteye_11116
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
css将div层固定显示在页面底部不随滚动条滚动
12-13
复制代码代码如下:#totop{position:fixed;right:10px;bottom:10px;width:100px;height:100px;}
div 固定不动，不随滚动条滚动且不闪动
yyongsheng的博客
06-07 8005
chinmo.net body{ margin:0px; padding:0px; } #glideDiv0{position:fixed; bottom:0;left:0; width:100%; background:#F00;} html{overflow:hidden;} body{height:100%;overflow:auto;} #glideDiv0{position
css控制某个div固定不动
热门推荐
qq_38422016的博客
05-10 1万+
固定最常用的方法就是对其进行定位。 但在定位的时候需要注意： ①如果想固定在屏幕的某处，那么确定被固定的元素的父元素是body； ②为固定元素设置宽高。 比如给你的footer的class添加如下代码： <style type="text/css"> .shopping_cart { position: fixed; left: 0; ...
CSS的position:fixed的使用(固定不动的div)
云曦沥雨
01-05 7081
前段时间，在做一个项目时需要使一个层相对于浏览器边框固定，那时用position:absolute试了下，发觉absolute是对网页边框而言的。后来，上网查了一些根据滚动条的移动，动态地改变left和top的值的JavaScript语句，虽然能实现了类似的效果，但滚动条移动时，那个层晃来晃去的，感觉不好看，想要一种能使层固定不动的做法。 且看下面的代码： #help{
jquery简单实现滚动条下拉DIV固定在头部不动
10-26
滚动条下拉DIV固定在头部不动效果，想必很多的朋友都有见到过吧，下面为大家详细介绍下使用jquery是如何实现的，感兴趣的朋友可以参考下
div模拟滚动条当div宽度小于18时滚动条不滚动
09-25
IE浏览器下使用div模拟滚动条当div宽度小于18时滚动条不滚动，具体的实现代码如下，需要的朋友可以参考下
固定Table第一行或某几行不随滚动条滚动而滚动
01-19
样式： 复制代码代码如下: .fixedHead { position: relative; top:[removed]this.offsetParent.scrollTop-2);...复制代码代码如下: <div> ”con_tbl”> ”fixedHead”> 标题不动</th> </tr> ”code”> <t
滚动条下拉DIV固定在头部不动
霸气十足的me
03-18 4218
pageEncoding="UTF-8"%> 滚动条下拉DIV固定在头部不动 *{padding:0;margin:0;} .ab{ width:100%; background-color:#eee; height:250px; text-align:center; line-height:250px;} .bc{ width:100%; background-c
设置一个div在页面的位置不动
weixin_33939843的博客
12-15 1368
2019独角兽企业重金招聘Python工程师标准>>> ...
CSS布局设置如何才能做到左边滑动右边不动，右边滑动左边不动
CSDN for recording problems
06-22 6591
最近有个小东西，分类筛选左侧超出了固定高度，想要他两边滚动但是不影响又右边的内容区域 注意这里是微信小程序的，但是大同小异 先看来看看效果 其实实现方式很简单两个属性搞定的事 当然我这里在左侧的最外层盒子中使用position: fixed; + overflow: auto; + float: left;搞定了。 .side-tab{ position: fixed; height: 100%; overflow: auto; float: left; } 如果想去去掉左侧滚动条可以设.
当div滚动到顶部时，DIV固定在顶部不动，不随滚动条滚动而滚动，除这个div以外的其它元素可以滚动
jokewangloveyou的专栏
02-19 9812
JS： 当div滚动到顶部时，DIV固定在顶部不动，不随滚动条滚动而滚动，除这个div以外的其它元素可以滚动 function scrollDiv () { var ie6 = document.all; var dv = $('#fixedMenu_keleyi_com'), st; dv.attr('otop', dv.offset().top); //存储原来的距离顶部的距离 $(window).scroll(function () { st = Math.max(doc
DIV相对页面位置固定不动
woshixushigang的专栏
04-27 1764
    项目中用到首页面背景为图片，但是登录所需的用户名和密码放在了页面div上，如果拖拽浏览器的窗体div会跟着一起动，怎   样才能解决这个问题呢？css样式解决了这个问题。     样式代码：   &lt;style&gt; .container_center1 { position:absolute; left:expression((body.clientWi...
css 页面滚动 多背景固定不动
weixin_30677475的博客
07-11 363
经常看到一些网站，滚动页面但是背景图不会跟着滚动，好像一直固定在浏览器窗口，感觉挺酷的，哇哦 ~ ~ 原来都是 background-attachment 这位大兄弟的功劳 background-attachment：需要配合background-image一起使用 　　scroll：默认值，背景随内容滚动而滚动 　　fixed：背景固定不动，不受内容滚动影响 直接上代码，哇哈哈哈 ~ ~ &...
固定div位置,不随滚动条上下动
最新发布
05-01
如何固定div位置，不随滚动条上下动呢？首先，我们需要了解一个css属性——position。 1. position属性 这个属性是用来设置元素的定位方式，它可以设置为static、relative、absolute、fixed、sticky五种值。在这里我们只关注fixed值，因为这个值能够实现我们要达到的效果。 2. fixed值 fixed的意思是“固定的”，意味着元素的位置是相对于浏览器窗口而言的。当设置一个元素的position属性为fixed时，它会被固定在浏览器窗口的某个位置。而这个位置可以通过top、right、bottom、left四个属性来确定。 3. 应用 为了让一个div固定在浏览器窗口的某个位置，只需要在css中给他加上如下属性： ``` position: fixed; top: 50px; left: 50px; ``` 其中，top和left是相对于浏览器窗口的距离，可以根据具体需要来调整。这样，这个div就会留在浏览器窗口的(50,50)处，不受滚动条的影响了。 综上，我们可以利用css中的position属性，将一个div固定在浏览器窗口中的某个位置，实现不随滚动条上下动的效果。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值