DIV定位右下角点击返回页面顶部

body里面第一个位置写一个a标签:

<a name="top" id="top"></a>

然后再用一个div 里面放一个a标签进行跳转:

<div id="fanhui">
        <a href="#top" target="_self">返回顶部</a>

</div>

再对这个div进行定位让其始终保持在屏幕的右下角:

<style type="text/css">
        #fanhui
        {
            position: fixed;
            bottom: 20px;
            right: 20px;
        }
    </style>

这样就达到效果了!

时间: 2024-07-30 00:33:37

DIV定位右下角点击返回页面顶部的相关文章

点击返回页面顶部-js

<script> window.onload=function(){ var oBtn = document.getElementById('btn'); var turn =false ; var time = null ; window.onscroll=function(){ if(turn){ clearInterval(time) } turn =true ; } oBtn.onclick=function () { time= setInterval(function(){ //

返回页面顶部最简单方法

<a href="#">返回页面顶部</a> 原文地址:https://www.cnblogs.com/mengfangui/p/8259027.html

解决点击a标签返回页面顶部的问题

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <style> 7 p{ 8 font-size: 400px; 9 } 10 </style> 11 </head> 12 <body> 13 <p&

解决点击空&lt;a&gt;标签返回页面顶部的问题

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> p{ font-size: 400px; } </style> </head> <body> <p>?</p> <a href=&quo

js网页返回页面顶部的小方法

咳咳,在网页出现滚动条的时候,许多网站会在右下角出现一个图标,点击可以回到页面顶部 本文就记录下js实现代码: 1.在html页面body添加dom元素 <img src="toTop.png" class="gotop" > <div class="gotopdiv" style="display: none;"><span>返回顶部</span></div> 2.

jquery点击回到页面顶部方法

1.代码实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>05-jQuery- 回到顶部案例</title> <style> .bk-top-box { position: fixed; bottom: 40px; right: 10px; cursor: pointer; } </

jquery返回页面顶部

1.此博文图片样式引用腾讯网站,效果如下: 2.样式设置: 1 #toTop { 2 /*选中的背景图片的大小*/ 3 width: 54px; 4 height: 54px; 5 display: none;/*刚开始不显示*/ 6 position: fixed; 7 right: 25px;/*距离右边大小值*/ 8 bottom: 45px;/*距离底部大小值*/ 9 /*选定图片区域*/ 10 background-image: url(images/qqbg_1.5.5.png);

点击返回到顶部

$(window).scroll(function () { var scrollH = window.screen.height; if ($(window).scrollTop() > scrollH) { $("#mob_backTop").fadeIn(60);// console.log($(window).scrollTop())// console.log(window.innerHeight)// console.log(scrollH)// console.lo

js 界面滚动方法 点击返回到顶部

function backTop(){    jQuery(window.top.document).find("html,body").animate({scrollTop:0},300);} jQuery(window).scroll(function(){    if(jQuery(window).scrollTop()>1){        jQuery("#backToTop").show(200);    }else{        jQuery(