<!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>模拟position:fixed</title>

</head>

<style>

* { padding:; margin:;}

body { height:%; overflow:hidden; font-size:14px; line-height:; position:relative;}

html { height:%; overflow:hidden;}

.fixed { position:absolute; top:10px; left:10px; width:200px; height:350px; background:#fc0; border:1px solid #f60;}

.wrapper { height:%; overflow:auto;}

.body { padding-top:10px; margin-left:232px;}

</style>

<body>

<div class="fixed">左边无论怎么滚动这个窗口它都不会动的</div>

<div class="wrapper">

<div class="body">

<li><a href="/soft/1843.shtml" target="_blank">显示内容1显示内容1显示内容1显示内容1</a></li>

<li><a href="/soft/1986.shtml" target="_blank">显示内容2显示内容2显示内容2</a></li>

<li><a href="/soft/4374.shtml" target="_blank">显示内容3显示内容3显示内容3</a></li>

<li><a href="/soft/1060.shtml" target="_blank">显示内容4显示内容4显示内容4</a></li>

<li><a href="/soft/4609.shtml" target="_blank">显示内容5显示内容5显示内容5</a></li>

<li><a href="/soft/1078.shtml" target="_blank">显示内容6显示内容6</a></li>

<li><a href="/soft/2030.shtml" target="_blank">显示内容7显示内容7显示内容7</a></li>

<li><a href="/soft/3119.shtml" target="_blank">显示内容8显示内容8显示内容8</a></li>

<li><a href="/soft/2927.shtml" target="_blank">显示内容9显示内容9显示内容</a></li>

<li><a href="/soft/2460.shtml" target="_blank">显示内容10显示内容10</a></li>

<li><a href="/soft/5654.shtml" target="_blank">显示内容11显示内容11</a></li>

<li><a href="/soft/3353.shtml" target="_blank">显示内容12显示内容12</a></li>

<li><a href="/soft/1852.shtml" target="_blank">显示内容13显示内容13</a></li>

<li><a href="/soft/1843.shtml" target="_blank">显示内容14显示内容14</a></li>

<li><a href="/soft/1986.shtml" target="_blank">显示内容15显示内容15</a></li>

<li><a href="/soft/4374.shtml" target="_blank">显示内容16显示内容16</a></li>

<li><a href="/soft/1060.shtml" target="_blank">显示内容17显示内容17</a></li>

<li><a href="/soft/4609.shtml" target="_blank">显示内容18显示内容18</a></li>

<li><a href="/soft/1078.shtml" target="_blank">显示内容19显示内容19</a></li>

<li><a href="/soft/2030.shtml" target="_blank">显示内容20显示内容20</a></li>

<li><a href="/soft/3119.shtml" target="_blank">显示内容21显示内容21</a></li>

<li><a href="/soft/2927.shtml" target="_blank">显示内容22显示内容22</a></li>

</div>

</div>

<div>脚本之家 http://www.jb51.net/</div>

</body>

</html>

css: absolute 模拟  fixed 效果

position：fixed 属性在iphone 中不起作用的更多相关文章

  1. 元素设置position:fixed属性后IE下宽度无法100%延伸

    元素设置position:fixed属性后IE下宽度无法100%延伸 IE bug 出现条件: 1.div1设置position:fixed属性,并且想要width:100%的效果. 2.div2(下 ...

  2. 解决IE6不支持position:fixed属性

    最近在优化网站浮动广告时候遇见了IE6不支持position:fixed属性.上网收集了一下解决方案 比较好的方案就是利用css表达式进行解决 补充:CSS Expression (CSS 表达式), ...

  3. 在IOS11中position:fixed弹出框中的input出现光标错位的问题

    问题出现的背景: 在IOS11中position:fixed弹出框中的input出现光标错位的问题 解决方案 一.设计交互方面最好不要让弹窗中出现input输入框: 二.前端处理此兼容性的方案思路: ...

  4. IOS系统不兼容position: fixed;属性的解决方案

    position: fixed;属性在IOS系统手机上会有很明显的抖动,解决方式: 只需要在中间部分外层div添加css样式position:fixed;top:50px; bottom:50px;o ...

  5. 父节点使用css的transform: translate(0, 0)时position:fixed在chrome浏览器中无效

    今天在做移动端的页面,无意间发现了一个Chrome浏览器下的一个bug,在使用CSS3的transform: translate(0, 0)属性对节点A进行位置转化,此时A节点下面有一个字节点B,节点 ...

  6. 小技巧css解决移动端ios不兼容position:fixed属性，无需插件

    移动端开发仿app头部底部固定设置position:fixed,android2.2以上已经实现.但是在ios8以下系统,当小键盘激活时,都会出现位置浮动问题.如图: 如何解决: 查阅资料之后想到一下 ...

  7. IOS中position:fixed弹出框中的input出现光标错位的问题

    解决方案是 在弹框出现的时候给body添加fixed <style type="text/css"> body{ position: fixed; width: 100 ...

  8. IE6不支持position:fixed属性

    _position:absolute; _bottom:auto; _top:expression(eval(document.documentElement.scrollTop+document.d ...

  9. iphone下元素放在了一个position: fixed的div中无法点击

    网上的说法是这样的: iphone的浏览器有这么一个bug, 当你使用锚定或滚动页面后, 你会发现某些东西不能点击了! 如果你的这个“东西”放在了一个position: fixed的div中, 那么你 ...

随机推荐

  1. Android SQLITE 操作工具类

    首先创建一个类 DatabaseHelper 继承SQLiteOpenHelper帮助类,定义数据库版本,数据库名称,创建表名. private static final int DATABASE_V ...

  2. # 2015-2016-2 《Java程序设计》课程总结

    2015-2016-2 <Java程序设计>课程总结

  3. cxf3.x +spring 3.x（4.x）+ maven 发布webservice 服务

    cxf 在做企业级webservices 服务的时候确实非常好用,个人觉得比axis1, 2都好用. 虽然spring自身也提供了webservices发布方法,这里使用cxf跟spring结合,使用 ...

  4. MyISAM 和InnoDB 的区别.(存储,索引, 事务, 锁)

    MyISAM类型的表强调的是性能,但是不支持事务.及外部键等高级功能. MySQL默认采用的是MyISAM. MyISAM不支持事务,而InnoDB支持.InnoDB的AUTOCOMMIT默认是打开的 ...

  5. Sigmaplot 13 破解版什么地方可以下载

    SigmaPlot是一款专业的科学绘图软件,可用于绘制准确.高质量的图形和曲线,支持一百多种2D.3D科学图形,同时拥有强大的数据统计分析功能.现在网络不断发展,软件使用日益频繁,今天小编就和大家分享 ...

  6. 【Matplotlib】详解图像各个部分

    首先一幅Matplotlib的图像组成部分介绍. 在matplotlib中,整个图像为一个Figure对象.在Figure对象中可以包含一个或者多个Axes对象.每个Axes(ax)对象都是一个拥有自 ...

  7. hihoCoder 后缀数组 重复旋律

    #1403 : 后缀数组一·重复旋律 时间限制:5000ms 单点时限:1000ms 内存限制:256MB 描述 小Hi平时的一大兴趣爱好就是演奏钢琴.我们知道一个音乐旋律被表示为长度为 N 的数构成 ...

  8. 【bzoj1227】 SDOI2009—虔诚的墓主人

    http://www.lydsy.com/JudgeOnline/problem.php?id=1227 (题目链接) 题意 一个n*m的公墓,一个点上要么是墓地,要么是常青树,给出一个数K,并规定每 ...

  9. log4j配置文件加载

    log4j的jar包内部包含preference默认配置,使用者可以通过log4j.xml或log4j.properties来指定自己的配置.xml比properties优先.另外注意java读取pr ...

  10. oracle---触发器总结

    一.触发器简介 触发器的定义就是说某个条件成立的时候,触发器里面所定义的语句就会被自动的执行.因此触发器不需要人为的去调用,也不能调用.然后,触发器的触发条件其实在你定义的时候就已经设定好了.这里面需 ...