后视镜加热按键图标_js点击按钮弹出图片

后视镜加热按键图标_js点击按钮弹出图片如何给自己的网站添加方便快捷的“返回顶部”小图标按钮呢?如下图:JS源代码:/***JavaScript脚本实现回到页面顶部示例*@paramacceleration速度*@paramstime时间间隔(毫秒)**/functiongotoTop(acceleration,stime){acceleration=acceleration||0.1…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

如何给自己的网站添加方便快捷的“返回顶部”小图标按钮呢?如下图:

459962-20161108201731889-366136735.png

JS源代码:

/**
* JavaScript脚本实现回到页面顶部示例
* @param acceleration 速度
* @param stime 时间间隔 (毫秒)
**/
function gotoTop(acceleration,stime) {
   acceleration = acceleration || 0.1;
   stime = stime || 10;
   var x1 = 0;
   var y1 = 0;
   var x2 = 0;
   var y2 = 0;
   var x3 = 0;
   var y3 = 0; 
   if (document.documentElement) {
       x1 = document.documentElement.scrollLeft || 0;
       y1 = document.documentElement.scrollTop || 0;
   }
   if (document.body) {
       x2 = document.body.scrollLeft || 0;
       y2 = document.body.scrollTop || 0;
   }
   var x3 = window.scrollX || 0;
   var y3 = window.scrollY || 0;
 
   // 滚动条到页面顶部的水平距离
   var x = Math.max(x1, Math.max(x2, x3));
   // 滚动条到页面顶部的垂直距离
   var y = Math.max(y1, Math.max(y2, y3));
 
   // 滚动距离 = 目前距离 / 速度, 因为距离原来越小, 速度是大于 1 的数, 所以滚动距离会越来越小
   var speeding = 1 + acceleration;
   window.scrollTo(Math.floor(x / speeding), Math.floor(y / speeding));
 
   // 如果距离不为零, 继续调用函数
   if(x > 0 || y > 0) {
       var run = "gotoTop(" + acceleration + ", " + stime + ")";
       window.setTimeout(run, stime);
   }
}

HTML源代码:

<div onClick="gotoTop();return false;" style="position:fixed;right:10px;bottom:15%;"><img src="http://images.cnblogs.com/cnblogs_com/wangduo/882494/o_top.png" width=36px;height=36px></div>

适用浏览器:IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗。

就是这么简单,就是这么任性!个性十足的你,赶快去试试吧!

代码有不理解的地方可以通过留言与博主交流!

转载于:https://www.cnblogs.com/wangduo/p/6044435.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/185339.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 国产操作系统: 盘点8款国产Linux桌面操作系统[通俗易懂]

    国产操作系统: 盘点8款国产Linux桌面操作系统[通俗易懂]2014年4月8日起,美国微软公司停止了对WindowsXPSP3操作系统提供服务支持,这引起了社会和广大用户的广泛关注和对信息安全的担忧。在这种背景下,国家出于计算机安全考虑,加大了针对操作系统开发力度,各软件企业纷纷开发自主操作系统。国产操作系统多以Linux为基础二次开发,今天我们为大家盘点一下二零一八年值得用户使用的国产Linux桌面操作系统。1.深度操作系统…

    2022年5月13日
    90
  • matlab中dde23函数_时滞模型的matlab编程

    matlab中dde23函数_时滞模型的matlab编程ddex1histz=@(t)2*ones(2,1);ddex1dez=@(t,y,Z)[y(1)*(1+0.1*sin(t)-0.1*Z(1,1)-y(2)/(1+y(1)));    y(2)*((2+sin(t))*10^(-5)+9*Z(1,2)/(1+Z(1,2))-Z(2,1))]; sol=dde23(ddex1dez

    2022年10月1日
    2
  • python批量修改文件夹名称_python文件扩展名主要有

    python批量修改文件夹名称_python文件扩展名主要有1、引言需要把.dat格式转化成.txt格式2、实现##python批量更换后缀名importos#列出当前目录下所有的文件files=os.listdir(‘.’)#print(‘files’,files)forfilenameinfiles:portion=os.path.splitext(filename)#如果后缀是.datifp

    2022年9月23日
    4
  • linux rsyslog配置_syslog配置

    linux rsyslog配置_syslog配置在centos7中,默认的日志系统是rsyslog,它是一个类unix计算机系统上使用的开源工具,用于在ip网络中转发日志信息。rsyslog采用模块化设计,是syslog的替代品。rsyslog具有如下特点:实现了基本的syslog协议。直接兼容syslogd的syslog.conf配置文件在同一台机器上支持多个rsyslogd进程丰富的过滤功能,可将消息过滤后再转发灵活的配置选项,配置文件中可…

    2022年9月25日
    2
  • 进程及进程控制块「建议收藏」

    进程及进程控制块「建议收藏」进程是程序的一个执行实例,是一个正在执行的程序。能分配处理器并由处理器执行的实体。     在一个系统上可以同时运行多个程序。并发运行,一个进程的指令和另一个进程的指令是交错执行的。     进程的两个基本元素是程序代码(可能被执行相同程序的其他进程共享)和代码相关联的数据集。进程是一种动态描述,但并不代表所有的进程都在运行(进程在内存中因策略或调度需求,会处于各种状态)。

    2025年7月22日
    3
  • MYSQL EXPLAIN结果详解

    MYSQL EXPLAIN结果详解EXPLAIN不会告诉你关于触发器、存储过程的信息或用户自定义函数对查询的影响情况。EXPLAIN不考虑各种Cache(缓存)。EXPLAIN不能显示MySQL在执行查询时所作的优化工作。部分统计信息是估算的,并非精确值。 EXPALIN只能解释SELECT操作,其他操作要重写为SELECT后查看执行计划。1idselect的识别符,这是select的查询序列号。如果有两列数据id相同,则为同一组查询,由上到下执行。如果id值不同,id值越大,优先级越高。2select_type

    2022年8月31日
    6

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号