vue中,实现锚点定位及跳转(url不发生变化)
<div class="footer" @click="returnTop">
document.querySelector("要返回地方的id").scrollIntoView(true);
如果滚动页面也是DOM没有解决的一个问题。为了解决这个问题,浏览器实现了一下方法,
以方便开发人员如何更好的控制页面的滚动。在各种专有方法中,HTML5选择了scrollIntoView() 作为标准方法。
scrollIntoView()可以在所有的HTML元素上调用,通过滚动浏览器窗口或某个容器元素,
调用元素就可以出现在视窗中。如果给该方法传入true作为参数,或者不传入任何参数,那么 窗口滚动之后会让调动元素顶部和视窗顶部尽可能齐平。如果传入false作为参数,调用元素会尽可能全部出现在视口中(可能的话,调用元素的底部会与视口的顶部齐平。)不过顶部不一定齐平
vue中,实现锚点定位及跳转(url不发生变化)的更多相关文章
- 在vue中实现锚点定位功能
场景如下: 今天早上看到需求方新提的一个需求,这是一份网上答卷,点击题数要实现滚动到对应题目的位置: 注意点:每题题目的高度是不受控制的,你可以取到想跳转的index:(我再循环题目时做了index+ ...
- vue中的锚点和查询字符串
1.什么是锚点 锚点(achor):其实就是超链接的一种. 如:普通的超链接 <a href="sub_task_detail.php">详细</a> 主 ...
- html中设置锚点定位的几种常见方法(#号定位)
在html中设置锚点定位我知道的有几种方法,在此和大家分享一下: 1.使用id定位: <a href="#1F">锚点1</a> <div id=&q ...
- 锚点定位且不改变url地址
锚点定位且不改变url html 事件触发<li v-for="(item,index) in couponsList.swaps" :key="index&quo ...
- html 页面内锚点定位及跳转方法总结
第一种方法,也是最简单的方法是锚点用<a>标签,在href属性中写入DIV的id.如下: <!DOCTYPE html><html><head> < ...
- html页面内锚点定位及跳转方法总结
1.最简单的方法是锚点用<a>标签,在href属性中写入DIV的id.如下: <!DOCTYPE html><html><head><style& ...
- 061——VUE中vue-router之通过程序控制路由跳转
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- html中设置锚点定位
1.使用id定位: (这样的定位可以针对任何标签来定位. ) <a name="1F" href="#1F">锚点1</a> <d ...
- vue 中 相同的路由不会跳转,更改路由的办法
vue 开发的项目,路由跳转的时候,是相同的路由是不会跳转,页面也不会有更新的 有时候 必须要跳转怎么办, 更改一个参数,num,一直在改变.就可以进入了. this.$router.push({ p ...
随机推荐
- js模板引擎mustache介绍及实例
在Javascript中 mustache.js是实现mustache模板系统. Mustache是一种没有逻辑的模板语法.它可以应用于HTML.配置文件.源代码等任何地方. 它通过使用散列或对象中提 ...
- js面向对象的程序设计 --- 上篇(理解对象)
前言 ECMAScript中没有类的概念,因此它们的对象与基于类的语言中的对象有所不同. ECMA-262把对象定义为:"无序的集合属性,其属性可以包含基本值,对象或者函数".正因 ...
- input placeholder 文字颜色修改
placeholder 文字颜色修改 input::-webkit-input-placeholder{ color:red; } input::-moz-placeholder{ /* Mozill ...
- python3 求一个list的所有子集
python3 求一个list的所有子集 def PowerSetsBinary(items): N = len(items) for i in range(2 ** N):#子集的个数 combo ...
- js打开新窗口,js打开居中窗口,js打开自定义窗口
================================ ©Copyright 蕃薯耀 2020-01-07 https://www.cnblogs.com/fanshuyao/ var is ...
- AcWing 874. 筛法求欧拉函数
#include<bits/stdc++.h> using namespace std; typedef long long ll; ; int primes[N],cnt; int ph ...
- 题解【UVA12003】Array Transformer
题目描述 输入输出格式 输入格式 输出格式 输入输出样例 输入样例#1 10 1 11 1 2 3 4 5 6 7 8 9 10 2 8 6 10 输出样例#1 1 2 3 4 5 6 7 8 9 6 ...
- golang中的net/rpc包
本文先介绍RPC,然后go原生对RPC的使用,之后是介绍go语言中有哪些RPC框架以及一些其他常见的框架,最后是探究go语言中rpc的源码. (1)首先介绍下什么RPC? (2)RPC可以做什么? ( ...
- 【C语言】一堆数组中存放了10个小于100的整数,请编程对所有数据按照从小到大的顺序进行排序,若个位数相等,则按照十位从小到大的顺序排序,输出排序后的结果
分析:取余,判断个位是否相等,利用冒泡法排序 #include <stdio.h> int main() { ] = { ,,,,,,,,, };/*数组*/ int i, j, k; ; ...
- 每天进步一点点------ORCAD Capture CIS
ORCAD Capture CIS 一.建工程及设置 1.选主菜单 file->new->project ;弹出 project wizard 对话框,取名Myproject : Mypr ...