两个div同时滚动
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>两个div同时滚动</title> <meta name="author" content="Administrator" /> <style type="text/css"> div{ overflow-x:scroll; width:10%; height:10%; border:1px blue solid; position:relative; } </style> <!-- Date: 2012-05-11 --> </head> <body>
<div id="d1"> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa </div>
<div id="d2"> bbbbbbbbbbbbbbbbbbb </div>
<script> var div1 = document.getElementById("d1"); var div2 = document.getElementById("d2"); function a(){ div2.onscroll = null; div2.scrollLeft = this.scrollLeft; div2.onscroll = b; } function b(){ div1.onscroll = null; div1.scrollLeft = this.scrollLeft; div1.onscroll = a; } div1.onscroll = a; div2.onscroll = b; </script> </body>
</html>
两个div同时滚动的更多相关文章
- div:给div加滚动栏 div的滚动栏设置
今天做了个样例: div 的滚动栏问题: 两种方法: 一. <div style=" overflow:scroll; width:400px; height:400px;”>& ...
- vue监听页面中的某个div的滚动事件,并判断滚动的位置
在开发中常常会遇到这样一个vue页面,页面分为左右两部分,左边是目录树,右边是一个类名为xq-box的div,在xq-box中多个div上下并列布局,每个div中的内容就对应着左边目录树中的相应节点, ...
- div+css:两个div并排等高 (table-cell)
两个div并排等高 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- 如何让两个div在同一行显示?一个float搞定
最近在学习div和css,遇到了一些问题也解决了很多以前以为很难搞定的问题.比如:如何让两个div显示在同一行呢?(不是用table表格,table对SE不太友好)其实,<div> 是一个 ...
- 两个div叠加触发事件发生闪烁问题
今天遇到一个问题,想实现一个功能: 当鼠标移到div1上的时候,会出现div2.出现时div2在div1的上面,div2在出现后发生闪烁的问题. 于是开始找问题根源,发现原来是因为当我们触发div1的 ...
- css两个form不换行,两个div并排代码
1.form不换行通过table布局实现 <table> <tr> <td> <form method="get" action=&quo ...
- html/css 两个div在同一行
在界面设计的时候,经常需要将两个div在同一行显示. 但是每次都会忘记怎么做,特此随笔,备忘. 如以下要将“第一个div”和“第二个div”显示在同一行: <div id="id1&q ...
- 如何定义让两个div横向排列
方法一: 一般情况,默认的div是写一个换一行,那么如何定义两个div横向排列而不换行呢? div默认的display属性是block.所以每一个div都是新的一行,现在把display换成inlin ...
- 两个div之间有空隙
加句*{ margin:0; padding:0;} 最近在做网页时发现,在IE7下(FF没试过),div与div之间有时会出20个像素左右的空隙,除非把margin设成负值,否则空隙无法去除.我在 ...
随机推荐
- javaweb项目开发错误代码
HTTP状态码(HTTP Status Code) 一些常见的状态码为:200 - 服务器成功返回网页 404 - 请求的网页不存在 503 - 服务不可用 所有状态解释:点击查看 1xx(临时响应) ...
- html5在移动端的屏幕适应性问题
html5在移动端的屏幕适应性问题 Html5 以前是最最炙手可热的技术.移动端也由于html5技术的增加变得更加变通一些.人人都喜欢"Write once.run more",但 ...
- Atitit.编程语言的基础句型and汉语英文比较
Atitit.编程语言的基础句型and汉语英文比较 1. 编程语言常见的句型1 1.1. Verb(obj)1 1.2. If then else1 1.3. For1 2. 英语中的五种基本句型结 ...
- php类库PHP QR Code 二维码
php类库PHP QR Code 二维码 php类库PHP QR Code 二维码 php类库PHP QR CodePHP QR Code is open source (LGPL) library ...
- dos2unix dos文本转换为linux文本 /bin/bas^M:bad interpreter
第一种方法:dos2unix -f 文本名 第二种方法: 首先:vi 文本名 然后::set ff? 如果出现fileforma=dos那么就确定是linux和windows之间的不完全兼容 :set ...
- Mac显示和隐藏隐藏文件
显示:defaults write com.apple.finder AppleShowAllFiles -bool true 隐藏:defaults write com.apple.finder A ...
- Spring MVC的@ResponseBody回来JSON串
1 406错误 <mvc:annotation-driven />不用动,请求的时候URL的文件扩展名应为json @ResponseBody会根据扩展名,或者Header,或者Param ...
- js yield
meikidd 发布在meikidd2015年5月6日view:3397 在文章任何区域双击击即可给文章添加[评注]!浮到评注点上可以查看详情. 隐藏标注 首先请原谅我的标题党(●—●),tj 大神的 ...
- 转载:tar 解压缩命令~
转载自:http://blog.csdn.net/dunyanan1/article/details/38869059tar -c: 建立压缩档案-x:解压-t:查看内容-r:向压缩归档文件末尾追加文 ...
- Codeforces Round #324 (Div. 2) (快速判断素数模板)
蛋疼的比赛,当天忘了做了,做的模拟,太久没怎么做题了,然后C题这么简单的思路却一直卡到死,期间看了下D然后随便猜了下,暴力了下就过了. A.找一个能被t整除的n位数,那么除了<=10以外,其他都 ...