想让DIV层滚动条显示在顶端,CSS样式没找到相关属性,于是用2个DIV层来模拟做了一个。
经测试IE浏览器上显示并不太美观!不知道是否还有更好的办法可以实现这功能呢?

 
aaaaaaasssssssdddddddfffffffgggggggghhhhhhhhhjjjjjjjjkkkkkkkkllllllllll
aaaaaaasssssssdddddddfffffffgggggggghhhhhhhhhjjjjjjjjkkkkkkkkllllllllll
aaaaaaasssssssdddddddfffffffgggggggghhhhhhhhhjjjjjjjjkkkkkkkkllllllllll
<!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>
<title></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#div2").css("overflow-x", "scroll").height().width($("#div1").width()+); //设置一个高度10的DIV2层 长度与DIV1层一致
$("#div2").html($("#div1").html()); //并给DIV2层填充内容 $("#div2").scroll(function () {
$("#div1")[].scrollLeft = $("#div2")[].scrollLeft; //拉动DIV2层滚动条,DIV1层滚动条同步被改变
});
});
</script>
</head>
<body>
<p></p>
<div id="div2"></div>
<div id="div1" style="border-style: solid; border-width: 1px; border-color: inherit; width:150px; height:120px; overflow-x:scroll; ">
aaaaaaasssssssdddddddfffffffgggggggghhhhhhhhhjjjjjjjjkkkkkkkkllllllllll<br />
aaaaaaasssssssdddddddfffffffgggggggghhhhhhhhhjjjjjjjjkkkkkkkkllllllllll<br />
aaaaaaasssssssdddddddfffffffgggggggghhhhhhhhhjjjjjjjjkkkkkkkkllllllllll<br />
</div>
</body>
</html>

JQuery Div层滚动条控制(模拟横向滚动条在最顶端显示)的更多相关文章

  1. 关于如何用Jquery监听鼠标滚轮改变横向滚动条

    $(function(){ if ((navigator.userAgent.indexOf('MSIE') >= 0)){/*判断是否是IE浏览器*/ var scroll_width = 1 ...

  2. jquery横向滚动条

    此代码献给wendy 由于工作太忙,下次再整理成插件调用,先记录下来,欢迎同学们提意见. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr ...

  3. 页面固定DIV层CSS代码

    有时候为了用户体验更好些,网页设计师会把网站导航放在一个固定的DIV层里面,不随滚动条滚动.本方法是利用CSS,position:fixed属性来固定层,fixed是特殊的absolute,即fixe ...

  4. 【转】selenium技巧 - 通过js来控制滚动条,通过xpath定位最上层的div层

    http://blog.csdn.net/iceryan/article/details/8162703 业务流程:   1.打开此网页 http://nanjing.xiaomishu.com/sh ...

  5. 自定义滚动条——控制div的大小和透明度

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 31.0px Consolas; color: #2b7ec3 } p.p2 { margin: 0.0px ...

  6. 1.横向滚动条,要设置两个div包裹. 2. 点击切换视频或者图片. overflow . overflow-x

    1.横向滚动条. div.1 > div.2 > img img  img 第一: 设置 div.1 一个固定的宽度 和高度  . 例如宽度 700px;  高度是 120px; 设置 o ...

  7. js div模拟水平滚动条

    这个也是我百度到的,但是忘记保存连接了,现在把代码贴上来,有需要的可以参考一下: <!DOCTYPE html> <html> <head> <meta ch ...

  8. DataTables固定表格宽度(设置横向滚动条)

    当表格的列比较多的时候,可能就需要固定表格的宽度了,默认的100%宽已经不适应了.默认的100%宽要实现改变窗口大小也100%的话,在table元素上添加width="100%", ...

  9. 网页出现横向滚动条的原因可能是使用bootstrap不当引起

    Bootstrap的栅格布局超级方便我们写网页.但是在不是全体配合使用的情况下,会出现横向滚动条的现象. 什么叫不是配合使用的情况呢? >>一种情况是:你使用了row作为你的第一层父元素: ...

随机推荐

  1. ListView中pointToPosition()方法使用具体演示样例

    MainActivity例如以下: package cc.testpointtoposition; import java.util.ArrayList; import java.util.HashM ...

  2. python笔记1,语法,函数,类和实例,异常

    >>> int(12.34) 12 >>> float('12.34') 12.34 >>> str(1.23) '1.23' >>& ...

  3. cookie做订单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. 四个 jQuery 方法:

    append() - 在被选元素的结尾插入内容 prepend() - 在被选元素的开头插入内容 after() - 在被选元素之后插入内容 before() - 在被选元素之前插入内容

  5. 夏日炎炎 python写个天气预报

    东南地区连续突破历史,江浙沪除了包邮之外的另一福利-桑拿也已到手.这样的日子里是应该每日关注天气主义降暑避免出现热疾病,python包含比 较多的网络应用类这样就方便了一些网络应用的操作,之外还有些可 ...

  6. GOCR v0.50 原理分析

    一,简介: GOCR是一个c写的开源OCR库,GNU Public License,作者:Joerg Schulenburg 项目主页:http://jocr.sourceforge.net/inde ...

  7. C2 CompilerThread0 如果抓到的java线程dump里占用CPU最高的线程是这个,99%可能是因为服务重启了

    "C2 CompilerThread0" #5 daemon prio=9 os_prio=0 tid=0x00007f20c80b3800 nid=0x57c0 runnable ...

  8. iPhone SDK中多线程的使用方法以及注意事项

    多线程iphonethreadapplication编程嵌入式 然现在大部分PC应用程序都支持多线程/多任务的开发方式,但是在iPhone上,Apple并不推荐使用多线程的编程方式.但是多线程编程毕竟 ...

  9. 关于浏览器内核与javascript引擎的一些小知识

    浏览器是我们每天几乎都必须使用的软件产品,可是对于自己每天都接触的浏览器,很多同学其实对其一无所知.今天异次元就跟大家说说关于浏览器内核的一些事儿吧,好让你了解多一点稍微内在的东西. 在下面的文章中主 ...

  10. Eclipse 启动时闪退问题解决方案

    一.以前Eclipse都可以正常使用,突然有一天不能启动了,点击图标后启动画面一闪之后就消失了,以下是一些解决方案: 1. 找到Eclipse目录下的eclipse.exe,右键点击->发送到桌 ...