`
Sharpleo
  • 浏览: 573875 次
  • 性别: Icon_minigender_1
  • 来自: newsk
社区版块
存档分类
最新评论

div跟滚动条移动

    博客分类:
  • js
 
阅读更多

	 function getScroll() {
         var t, l, w, h;
         if (document.documentElement && document.documentElement.scrollTop) {
             t = document.documentElement.scrollTop;
             l = document.documentElement.scrollLeft;
             w = document.documentElement.scrollWidth;
             h = document.documentElement.scrollHeight;
         }

         else if (document.body) {
             t = document.body.scrollTop;
             l = document.body.scrollLeft;
             w = document.body.scrollWidth;
             h = document.body.scrollHeight;
         }
         return { t: t, l: l, w: w, h: h };
     }

     window.onscroll = function() {
         var v = getScroll();
         var e = document.getElementById("timediv");
         e.style.position = "absolute";
         e.style.top = v.t;  //纵滚动条离顶部距离
         e.style.left = "1140px";  //离左端距离                       
     }
分享到:
评论

相关推荐

    div跟随水平滚动条移动

    div或其他html块内容跟随滚动条移动,滚动移动时,内容跟着移动,并保持最右边

    div随滚动条上下滚动

    在网页设计中,"div随滚动条上下滚动"是一种常见的动态效果,通常用于实现固定定位或者跟随滚动的视觉效果。这种效果可以通过JavaScript库jQuery和原生JavaScript来实现,以增加用户体验,使某些元素如导航栏、侧...

    jQuery实现将div的滚动条滚动到指定位置

    在网页开发中,jQuery是一个非常...总的来说,通过jQuery的`animate()`方法,我们可以轻松地实现div滚动条的动态控制,为用户提供更加友好的交互体验。这个功能在展示长列表、分页内容或者需要聚焦某个部分时特别有用。

    随滚动条移动的DIV层

    ### 随滚动条移动的DIV层:实现与解析 #### 一、概述 在网页设计与开发过程中,为了提高用户体验以及页面的交互性,常常会遇到需要制作一个随滚动条移动的元素(如提示框、广告栏等)。本文将通过分析一段具体的...

    div不随滚动条的移动而改变位置

    标题"div不随滚动条的移动而改变位置"所指的问题是关于如何实现一个固定定位(fixed positioning)的 `div` 元素。这种效果使得 `div` 在页面上保持在一个特定位置,即使用户滚动页面,它也不会移动。这通常用于创建...

    div滚动条优化

    "div滚动条优化"这个主题主要关注如何在不牺牲滚动功能的前提下,通过CSS样式和JavaScript技术来美化或定制滚动条,使其更加符合现代网页的审美标准和用户体验需求。 首先,我们要了解默认滚动条的样式通常是浏览器...

    Jquery跟随滚动条移动的div动画效果

    "Jquery跟随滚动条移动的div动画效果"就是一个典型的例子,它利用jQuery库实现了一个div元素随着页面滚动条移动而同步移动的特效,而且这个div在移动过程中保持平滑,避免了闪烁现象,提升了用户体验。 首先,...

    div 的滚动条问题

    div 的滚动条问题 div自动添加滚动条,防止div移动位置

    div随着滚动条滚动,但是到了顶部,便不随着滚动了

    ### div随着滚动条滚动,但是到了顶部,便不随着滚动了 #### 背景介绍 在网页设计中,有时我们需要让某个元素(如`<div>`)在页面滚动时保持固定的位置,或者达到特定位置后固定不动。这种效果常用于导航栏、侧边栏...

    层随滚动条移动

    ### 层随滚动条移动技术解析 #### 技术背景与概述 在Web开发中,实现元素(如层)随着页面滚动条的滚动而移动的效果,可以为用户提供更好的交互体验。这种技术通常被称为“粘性定位”或“固定定位”,但在这里提到...

    如何让DIV固定在页面的某个位置而不随着滚动条随意滚动

    在前端开发中,我们常常需要让某个DIV元素固定在页面的某个位置,而不随着滚动条的滚动而移动。这可以通过使用CSS的position属性来实现,特别是使用fixed值。fixed值可以让元素固定在页面的某个位置,而不受滚动条的...

    拖动div 内部有滚动条

    在处理带有内部滚动条的 `div` 时,我们常常需要实现拖动功能,让用户能够通过鼠标拖动来查看内容,特别是在内容超出 `div` 边界时。这种效果常见于各种自定义滚动条或者数据展示区域的设计。 要实现“拖动div内部...

    JQuery 随鼠标滚动条滚动的div

    <div id="fixedDiv">我是一个随滚动条移动的div</div> <!-- 填充一些内容以产生滚动 --> 这里是大量的内容…… $(document).ready(function() { var $fixedDiv = $('#fixedDiv'); var initialTop = $...

    简易的jquery层随滚动条移动

    本教程将详细讲解如何使用jQuery实现一个简单的层(div)随滚动条移动的效果。 首先,我们需要理解jQuery的基本概念。jQuery是一个快速、简洁的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及Ajax交互等...

    Div滚动条随鼠标滚动js版(由网友JQuery版改写而成)

    这种方法的关键在于正确计算滚动距离,确保内容在视觉上平滑移动,同时保持与实际滚动条操作一致的用户体验。 以下是一些关键知识点: 1. **DOM事件监听**:JavaScript可以通过`addEventListener`方法监听DOM元素...

    不随滚动条滚动而滚动的浮动效果

    随滚动条移动的层 .div { position: absolute; border: 2px solid red; background-color: #EFEFEF; line-height: 90px; font-size: 12px; z-index: 1000; } <div id="Javascript.Div1" class=...

    js实现鼠标滑动到某个div禁止滚动

    鼠标移动进入该区域,页面禁止滚动 </div> ``` 2. 在页面加载完成后,通过JavaScript代码动态地向body中添加了一些测试用的div元素,以演示效果。 ```javascript window.onload=function(){ for(i=0;i;i++){ var...

    浮动广告,跟随滚动条移动的源码

    这种类型的广告会在用户浏览页面时,随着滚动条一起上下移动,始终保持在用户的视野范围内,以提高广告的可见性和点击率。本压缩包提供的“可关闭对联广告代码”正是实现这种效果的一种源码示例。 浮动广告的技术...

    通过JQuery将DIV的滚动条滚动到指定的位置方便自动定位

    本文将介绍如何使用JQuery实现div滚动条的自动定位。 首先,我们需要了解JQuery的基础知识。JQuery是一个快速、简洁的JavaScript库,它通过简化HTML文档遍历和事件处理、动画和Ajax交互,使得Web开发变得更加方便和...

    外部滚动条控制iframe

    2. **监听外部滚动条事件**:为外部的滚动容器(如div)添加滚动事件监听器,当外部滚动条移动时触发相应函数。 3. **同步iframe内部滚动位置**:在事件处理函数中,根据外部滚动条的位置,使用JavaScript设置...

Global site tag (gtag.js) - Google Analytics