<!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同时滚动的更多相关文章

  1. div:给div加滚动栏　div的滚动栏设置

    今天做了个样例: div 的滚动栏问题: 两种方法: 一. <div style=" overflow:scroll; width:400px; height:400px;”>& ...

  2. vue监听页面中的某个div的滚动事件，并判断滚动的位置

    在开发中常常会遇到这样一个vue页面,页面分为左右两部分,左边是目录树,右边是一个类名为xq-box的div,在xq-box中多个div上下并列布局,每个div中的内容就对应着左边目录树中的相应节点, ...

  3. div+css:两个div并排等高 (table-cell)

    两个div并排等高 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  4. 如何让两个div在同一行显示?一个float搞定

    最近在学习div和css,遇到了一些问题也解决了很多以前以为很难搞定的问题.比如:如何让两个div显示在同一行呢?(不是用table表格,table对SE不太友好)其实,<div> 是一个 ...

  5. 两个div叠加触发事件发生闪烁问题

    今天遇到一个问题,想实现一个功能: 当鼠标移到div1上的时候,会出现div2.出现时div2在div1的上面,div2在出现后发生闪烁的问题. 于是开始找问题根源,发现原来是因为当我们触发div1的 ...

  6. css两个form不换行，两个div并排代码

    1.form不换行通过table布局实现 <table> <tr> <td> <form method="get" action=&quo ...

  7. html/css 两个div在同一行

    在界面设计的时候,经常需要将两个div在同一行显示. 但是每次都会忘记怎么做,特此随笔,备忘. 如以下要将“第一个div”和“第二个div”显示在同一行: <div id="id1&q ...

  8. 如何定义让两个div横向排列

    方法一: 一般情况,默认的div是写一个换一行,那么如何定义两个div横向排列而不换行呢? div默认的display属性是block.所以每一个div都是新的一行,现在把display换成inlin ...

  9. 两个div之间有空隙

    加句*{ margin:0; padding:0;} 最近在做网页时发现,在IE7下(FF没试过),div与div之间有时会出20个像素左右的空隙,除非把margin设成负值,否则空隙无法去除.我在 ...

随机推荐

  1. unity, 慎用DontDestroyOnLoad

    如果想让一个节点切换场景时不销毁,可以为它添加如下脚本: using UnityEngine;using System.Collections; public class dontDestroyOnL ...

  2. jQuery Ajax 学习（转）

    Ajax全称:Asynchronous JavaScript and XML(异步的JavaScript和XML)特点:在不必刷新整个网页的情况下实现局部更新,带来更好的用户体验.因为XMLHttpR ...

  3. linux navicat 过期 解决办法

    :~$ cd .navicat:~/.navicat$ rm *.reg:~/.navicat$ rm .update-timestamp:~/.navicat$ rm navicat.crontab ...

  4. 使用CSS3实现响应式标题全屏居中和站点前端性能

    要实现标题全屏居中(同一时候在垂直和水平方向居中).有若干种方法,包含使用弹性布局.表格单元.绝对定位和自己主动外边距等. 全屏居中 当中眼下比較流行也比較easy理解的方法是使用绝对定位+偏移实现. ...

  5. android launcher2开发之 有抽屉改成无抽屉

    在launcher.java中在createShortcut方法中   屏蔽全部应用button 修改之前 View createShortcut(int layoutResId, ViewGroup ...

  6. Windows GDI 映射模式（出自：Windows程序设计第5版－珍藏版）

    GDI映射模式(mapping mode):和映射模式紧密相关的还有4个其它的设备环境属性:1.窗口原点(window origin)2.视口原点(viewport origin)3.窗口范围(win ...

  7. 【转载】表单验证<AngularJs>

    原文地址:http://www.cnblogs.com/rohelm/archive/2014/10/19/4033513.html 常用的表单验证指令 1. 必填项验证 某个表单输入是否已填写,只要 ...

  8. css制作的各种图形

    1.六角形的制作: 代码: #star-six{ height:0; width:0; border-bottom:100px solid red; border-left: 50px solid t ...

  9. OC-1-面向对象

    课程要点: C语言是一种面向过程的语言,OC是一种面向对象的语言 类与对象的关联 如何在xcode中创建一个类 如何在类中标记该类事物的属性和动作 C语言是一种面向过程的语言,OC是一种面向对象的语言 ...

  10. C# 子类实例化过程

    刚研究了一下C#子类实例化的过程. 首先我遇到了如下一个问题: 有类A,里面写了一个有参的构造函数,并没有提供默认的无参构造函数.现在类B继承了类A,没有写任何的构造函数. 这时如果想实例化类B就会产 ...