div瞄点

最新推荐文章于 2023-06-10 23:41:14 发布
最新推荐文章于 2023-06-10 23:41:14 发布
阅读量215 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： html 文章标签： javascript ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/cainwise/article/details/84060287
本文介绍了一个使用纯HTML和CSS实现的滚动定位示例。通过页面内的锚点链接，可以实现在长页面中快速滚动到指定位置的功能。此示例展示了如何设置锚点以及如何使用JavaScript进行平滑滚动。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
.main{ height:1500px; }
.container{ height:300px; overflow:scroll; overflow-x:hidden; background:#ccc; }
.container p{ margin:20px 0; }
</style>
</head>
<body>
<div class="main" >
    <a href="javascript:point.scrollIntoView(false);">锚点连接</a>
    <div class="container" >
        <p>stop1</p>
        <p>stop1</p>
        <p>stop1</p>
        <p>stop1</p>
        <p>stop1</p>
        <p>stop1</p>
        <p>stop1</p>
        <p>stop1</p>
        <p>stop1</p>
        <p>stop1</p>
        <p id="point">锚点连接</p>
        <p>stop1222</p>
        <p>stop1111</p>
        <p>stop1111</p>
        <p>stop11222</p>
        <p>stop1</p>
        <p>stop1</p>
    </div>
</div>
</body>
</html>

div使用自定义属性锚点跳转，滚动
jieweiwujie的博客
09-26 106
【代码】div使用自定义属性锚点跳转，滚动。
div锚点链接跳转
weixin_30273931的博客
09-21 368
a标签href可跳转到知道dom节点（通过id） 代码 <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"> <title>锚点...
锚点和div，span标签
xh888zw的博客
04-06 744
锚点 锚点的设置 给标签设置name或id属性 通过另外一个a标签href属性去链接这个锚点，可以链接到当前页面中的指定位置， 还可以链接到其他页面的指定部分。 例如 div和span标签 div:容器级标签，(divisign。 范围、区域、分割)用来划分独立的逻辑块 是一个容器(大的区域)， 本身在网页中没有任何的默认样式，可以放置任何标签和内容。 里面可以存放一些相近、相同功能的标签。 div会 把页面分割成一个小的区域。 span:文本级的标签，只能放文字、图片、表单元素等，用来修饰部分文本的效果(
CSS锚点
qtvb1987的专栏
11-30 1068
CSS锚点使用有两种方法：     到达第一个锚点     到达第二个锚点     我是第一个锚点     我是第一个锚点  这样当我们点击A链接时， 对应的DOM节点就会滚动到窗口顶部。  但有时我们的需求并不是让它滚动到窗口顶部。 可能要他距离顶部有一定的距离。这时候可以由以下方法解决。   到达第一个锚点     到达第二个锚点
HTML 设置锚点
jjw_zyfx的博客
09-14 1128
页面内跳转到指定div的几种方法（锚点、hash、animate、scrollIntoView）
I大俊
09-10 1万+
页面内跳转到指定div的几种方法（锚点、hash、animate、scrollIntoView） 由于最近有回到顶部、根据nav定位到指定div和定位到输入错误的输入框的需求，所以在此分析此类需求可能的解决方案 用a标签的href属性 这是比较常用的一种方法 href。这是一个必需属性为锚定义一个超文本链接来源。这表示链接目标的URL或URL片段。URL片段是由一个hash符号（...
小程序实现锚点跳转
JavaScritp
12-02 1312
小程序实现锚点跳转（非scroll-view实现） 通过点击事件跳转到指定的位置，在HTML中很容易实现。但在小程序中一般需要借助scroll-view组件来实现，而scroll-view在实现效果时，需要指定固定的高，但大多数时候我们不知道最终要显示的有多高，动态计算也比较麻烦。有没有其它的办法实现这种滚动效果呢？当然是有的。 通过给跳转位置绑定id类名的方式（类名必须是id），就可以实现，具体...
android 百度地图 描点,百度地图--实现增加打点（mark）自定义图标、自定义地图样式、 运动轨迹...
weixin_28396629的博客
05-27 1453
需求背景1、查看某个地区所有业务员的坐标2、点击业务员坐标可展示具体信息、当前具体地址3、点击某个业务员名字，自动关联到地图上的位置4、查看业务员当天的行程轨迹5、动态切换地图上坐标的自定义图标6、支持展示所有业务员在可视区内(自适应缩放地图比例，展示所有业务员位置)之所以没有选择用vue-baidu-map，是因为有bug。。。如果你之前没有接触过地图方面的开发，建议先去官网熟悉一下api。百度...
【LGR-142-Div.4】洛谷入门赛 #13 考后分析与题解
BZ_C25LX 的博客
06-10 4648
【LGR-142-Div.4】洛谷入门赛 #13 考后分析与题解
CSS-锚点
weixin_57936267的博客
05-09 2305
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do.
creator 反复横跳瞄准线的实现
m0_63275099的博客
11-14 2847
1.效果 2.原理 对有反射功能的物体添加物理引擎的刚体与碰撞器，利用射线检查路线上面是否有对应的碰撞物体。有就对当前碰撞点。进行向量加法与点乘计算（具体计算公式请面向百度或者查看代码）来得到反射的向量。然后重复之前的操作。 3.代码 const { ccclass, property } = cc._decorator; @ccclass export default class PhysicalLineModule extends cc.Component { ...
html页面添加锚点
Love666Code的博客
11-16 8743
锚点即指html中的链接，在页面中适当的添加锚点可以大大提高阅读或查找效率，尤其是一些内容分类繁多的页面。 添加锚点的方式有以下： （1）根据锚点文本标签的id属性设置，通过a标签定位： &amp;amp;amp;amp;amp;lt;div&amp;amp;amp;amp;amp;gt; &amp;amp;amp;amp;amp;lt;a href=&amp;amp;amp;amp;quot;#maoDianId&amp;amp;amp;amp;quot;&
JS控制div跳转到指定的位置的几种解决方案总结
weixin_34010566的博客
08-08 642
原文：http://www.jb51.net/article/96574.htm 这篇文章主要介绍了JS控制div跳转到指定的位置的几种解决方案总结，小编觉得挺不错的，现在分享给大家，也给大家做个参考。 总结一下自己在写这个需求遇到的问题，相信大家应该是经常遇到的。即要求滚轮滚动到指定的位置。先看下基本的解决方案。 1.给链接a加个#的方式来实现跳转。（锚点方法）这里直接贴下代码: ...
html 页面内锚点定位及跳转方法总结
weixin_34007291的博客
12-03 521
  第一种方法，也是最简单的方法是锚点用&lt;a&gt;标签，在href属性中写入DIV的id。如下： &lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;style&gt; div { height: 800px; width: 400px; border:...
控制div跳转到指定位置的若干方法&控制页面定位到指定位置
weixin_44037153的博客
07-20 823
方法一：用链接a锚点方法 div1 div2 div3 div1 div2 div3 css样式： div { height: 800px; width: 400px; border: 2px solid black; } #container{ position: fixed; margin:50px 500px; } 方法二：使用jquery的animate方法 html页面： div1 div2 div3 div1 di
HTML5_ScrollInToView方法
荆莿鸟
08-03 2万+
HTML5_ScrollInToView方法 window.onload = function(){ /* 如果滚动页面也是DOM没有解决的一个问题。为了解决这个问题，浏览器实现了一下方法， 以方便开发人员如何更好的控制页面的滚动。在各种专有方法中，HTML5选择了scrollIntoView() 作为标准方法。 scrollIntoV
纯CSS实现锚点跳转位置上下偏移的办法
tian361zyc的博客
07-04 1万+
css
三种div点击事件
热门推荐
qq_40331957的博客
05-10 2万+
第一种方法，直接在div上添加onclick <div id="div" onclick="alert('成功')">点击</div> 第二种，DOM0级事件处理 var oDiv = document.getElementById("div"); oDiv.onclick = function(){ alert("成功"); } 第三种，DOM2级事...
html中的描点怎么写,html 锚点的使用
weixin_28419039的博客
06-03 1072
html 锚点到底是干吗的？通俗简单地说，比如一篇很长的文章，你想按分段精确来看，那就可以用到锚点了。代码：跳到001...文字省略...文字省略其实锚点只需name就可以可，加id是为了让它兼容性更好.href的值要跟name \ i d 一致，前面必须加"#"，以上代码在ie6/7,ff中都可以兼容，但在ie8中就不行。因为我们锚点的值为空，为不影响美观我们加个空格就行了,如以下代码，就可以...
图片瞄准线特效的实现与应用
- HTML代码结构大致会是一个`<div>`容器，内部可能还包含了用于显示瞄准线的元素，如`<img>`标签用于引入瞄准图片，`<canvas>`标签可能用于绘制瞄准线路径等。 - CSS代码会应用到上述HTML元素上，为瞄准线和其附属...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值