Basé sur l'implémentation de jQuery pour revenir à l'exemple principal code

Basé sur l'implémentation de jQuery pour revenir à l'exemple principal code_jquery

WBOY

Libérer： 2016-05-16 15:22:29

original

1289 Les gens l'ont consulté

Les rendus sont présentés ci-dessous :

Utilisation :

Référencez simplement la bibliothèque jQuery et le plug-in YesTop, puis revenez en haut avec une ligne de code :

Code devis :

<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>

Copier après la connexion

Utiliser le code :

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

Copier après la connexion

C'est à dire :

$.fn.yestop();

Ce code suffit.

Bien sûr, il existe des paramètres avancés, tels que changer les images, définir les icônes pour qu'elles soient circulaires, définir l'emplacement, définir l'heure, etc. Veuillez consulter d'autres démos pour plus de détails.
Complétez le code, enregistrez-le dans un fichier HTML pour découvrir l'effet :

<!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>

Copier après la connexion

Le contenu ci-dessus est destiné à partager avec vous l'exemple de code de retour au sommet basé sur jQuery. J'espère qu'il vous plaira.