jQuery 回到顶端

<!doctype html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title></title>

</head>

<style>

body{height:2500px;}

.go_top{right:10px;bottom:10px;position:fixed;cursor:pointer;}

</style>

<body>

<input type="button" value="go_top" class="go_top">

</body>

</html>

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>

<script>

$(function(){

//回到顶端按钮点击的时候

$(‘.go_top‘).click(function(){

//给 body html 绑定动画,设置滚动条距离为0 速度为300毫秒

$(‘body,html‘).animate({scrollTop:0}, 300);

})

});

</script>

jQuery 回到顶端

时间: 2024-10-16 10:06:43

jQuery 回到顶端的相关文章

js监听滚动条 回到顶端

效果:当出现滚动条,且滚动条出现移动时,把回到顶端按钮 显示出来:当滚动条回到顶部时,将回到顶端按钮隐藏. <script type="text/javascript"> //获取滚动条的位置 function getScrollTop() { var scrollPos; if (window.pageYOffset) { scrollPos = window.pageYOffset; } else if (document.compatMode && d

javascript 回到顶端

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

html css jquery 回到顶部按钮

今天做了个回到顶部的功能,在这里记录一下,有需要可以拿去试试! CSS部分,很简单就一个class /*回到顶部*/ .back-top { position: fixed; right: 15px; bottom: 15px; z-index: 9999; font-size: 25px; width: 40px; height: 40px; background-color: #adadad; color: #ffffff; cursor: pointer; border-radius: 2

jQuery回到顶部插件jQuery GoUp

插件描写叙述 jQuery GoUp!是一个简单的jQuery插件,让你的网页用户直接回到顶部. 用法很easy 引用jquery库和jquery.goup.min.js到你的页面 <script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="jquery.goup.min.j

jquery回到顶部源码分享-

// JavaScript Document (function($){ var goToTopTime; $.fn.goToTop=function(options){ var opts = $.extend({},$.fn.goToTop.def,options); var $window=$(window); $body = (window.opera) ? (document.compatMode == "CSS1Compat" ? $('html') : $('body'))

jquery回到页面顶动画

回到顶部和回到底部在当前的网页中应用时相当广泛的为了更好的体验,我们在回到顶部或回到底部的过程中采用一个渐进的滚动那么我们就要用到强大的 Jquery 了.具体步骤如下: 1.在压面 body 中的任何地方加入一下代码 <div id="scroll">           <div id="toTop" class="scrollItem">         回到顶部     </div>       <

jquery 返回顶端组件

自己写了一个基于jquery的返回页面顶端的组件. (function($) { var g; $.backtop = function(options) { extend($.backtop.config, options); this.config = $.backtop.config; this.init(); g = this; }; $.backtop.config = { title : null,// 返回顶端文字说明 df_color : "#77AA55"// 组件默

jquery 回到 顶部

1. 页面内容较多, 从底部超链接 点击回到页面顶部 // 回到顶部 var $top = $('<a class="doc-gotop" href="javascript:;">TOP</a>') .on('click', function () { $(window).scrollTop(0); return false; }); $('body').append($top);

Jquery回到顶部效果

<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <style type = "text/css"> #sp{ position:fixed; top:70%; left:82.5%; cursor:pointer;} </style> <script ty