博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
锚点跳转的过渡效果
阅读量:6935 次
发布时间:2019-06-27

本文共 778 字,大约阅读时间需要 2 分钟。

 

CSS实现:http://stackoverflow.com/questions/17631417/css-pure-css-scroll-animation

jq实现:

$(function () {    $('a[href*=#],area[href*=#]').click(function () {        console.log(this.pathname)        if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {            var $target = $(this.hash);            $target = $target.length && $target || $('[name=' + this.hash.slice(1) + ']');            if ($target.length) {                var targetOffset = $target.offset().top;                $('html,body').animate({                    scrollTop: targetOffset                },                        1000);                return false;            }        }    });});

  

转载于:https://www.cnblogs.com/dunitian/p/5314749.html

你可能感兴趣的文章
实验c语言不同类型的指针互用(不推荐只是学习用)
查看>>
iOS:NSFileHandle和NSFileManger的使用
查看>>
HTML5新特性之文件和二进制数据的操作
查看>>
Camtasia Studio CamStudio如何不录制鼠标
查看>>
内核源码阅读(三)进程命名空间和用户命名的实现
查看>>
redis两种持久化方式的优缺点
查看>>
腾讯2016笔试题-微信红包-找出数组中过半数的数字
查看>>
Vivado下生成及烧写MCS文件
查看>>
python基础技巧综合训练题1
查看>>
如何确定HyperThreading是否在Linux上已开启?
查看>>
线程调试
查看>>
Visual Studio 2015 和 Apache Cordova
查看>>
mysql之 innobackupex备份+binlog日志的完全恢复【转】
查看>>
Ubuntu下Ansible安装和使用
查看>>
【mybatis】mybatis中 的# 和 $的区别
查看>>
IDEA教程之导入maven项目
查看>>
nginx+jwplayer配置flv/MP4点播系统, 视频拖动支持
查看>>
phalcon: 解决php7/phalcon3.2以上版本,不支持oracle数据库的方法
查看>>
爬虫遇到的坑——发现你是爬虫抛出假数据
查看>>
PowerDesigner连接Oracle并导出表结构
查看>>