Based on jQuery implementation to return to the top example code

Based on jQuery implementation to return to the top example code_jquery

WBOY

Release： 2016-05-16 15:22:29

Original

1280 people have browsed it

The renderings are shown below:

Usage:

Just reference the jQuery library and YesTop plug-in, and then return to the top with one line of code:

Quotation code:

<script type="text/javascript" src="http://hovertree.com/ziyuan/jquery/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="http://hovertree.com/texiao/yestop/inc/jquery.yestop.js"></script>

Copy after login

Use code:

<script type="text/javascript">
   $(document).ready(function () { $.fn.yestop(); })
</script>

Copy after login

That is:

$.fn.yestop();

This code is enough.

Of course there are advanced settings, such as changing pictures, setting icons to be circular, setting location, setting time, etc. Please view other demos for details.
Complete code, save it to HTML file to experience the effect:

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8">
  <title>YesTop - HoverTree</title><meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script type="text/javascript" src="http://hovertree.com/ziyuan/jquery/jquery-1.11.3.min.js"></script>
  <script type="text/javascript" src="http://hovertree.com/texiao/yestop/inc/jquery.yestop.js"></script>
  <style>
    body {
      margin: 0px;font-family:Arial
    }a{color:blue}
  </style>
</head>
<body>
  <div style="text-align:center;width:100%;margin:0px auto;">
    <h1>YesTop</h1>
    A jQuery Plugin<br />
    <a href="http://hovertree.com/texiao/yestop/">Demo 1</a> <a href="http://hovertree.com/texiao/yestop/demo2.htm">Demo 2</a> <a href="http://hovertree.com/texiao/yestop/demo3.htm">Demo 3</a>
    <a href="http://hovertree.com/texiao/yestop/demo4.htm">Demo 4</a> <a href="http://hovertree.com/h/bjaf/topimage.htm">Images</a>
  </div>
  <div style="height: 360px;background-color: #66FF66;">
    
  </div>
  <div style="width:100%;text-align:center;height:200px">&copy; hovertree.com</div>  
  <div style="height: 200px; visibility: visible; background-color: Olive">
  </div><div style="height:200px;background-color:burlywood"></div><div style="height:200px;background-color:darkorchid"></div>
  <div style="height: 200px; visibility: visible; background-color:gray">
  </div>
  <div style="height:200px;background-color:blue"></div>
  <div style="height:200px;background-color:red"></div>
  <div style="height:200px;background-color:yellow"></div>
  <div style="height:200px;background-color:yellowgreen"></div>
  <div style="height:800px;background-color:white"></div>
  <script type="text/javascript">
    $(document).ready(function () { $.fn.yestop(); })
  </script>
</body>
</html>

Copy after login

The above content is to share with you the example code of returning to the top based on jQuery. I hope you like it.