Jquery returns the top component, and jquery returns the top component.
I wrote a jquery-based component to return to the top of the page.
(Function ($) {var g; $. backtop = function (options) {extend ($. backtop. config, options); this. config = $. backtop. config; this. init (); g = this;}; $. backtop. config = {title: null, // return the top text description df_color: "#77AA55" // default component color}; $. backtop. prototype = {config: null, backtop: null, // The top object init: function () {this. _ scrool () ;}, _ scrool: function () {window. onscroll = function () {g. _ create_ob ($ (window ). scrollTop () ;};}, _ create_ob: function (top) {if (top = 0) {$ ("# back_top "). remove (); return ;}$ ("# back_top "). remove (); this. backtop = $ ("<div class = 'mouseover'> </img> </div>"); $ (this. backtop ). bind ("click", function () {g. _ moveTo () ;}); $ (this. backtop ). bind ("mouseover", function () {$ (g. backtop ). removeClass (); $ (g. backtop ). addClass ("mouse") ;}); $ (this. backtop ). bind ("mouseout", function () {$ (g. backtop ). removeClass (); $ (g. backtop ). addClass ("mouseover") ;}; $ (this. backtop ). attr ("id", "back_top");/* configure (this.backtop).css ("backgroundColor", this. config. df_color); */second ("zIndex", 1000); Second (this.backtop).css ("position", "absolute"); Second (this.backtop).css ("cursor", "pointer"); $ (this. backtop ). width (30); $ (this. backtop ). height (30); left (this.backtop).css ("left", $ ("body "). attr ("clientWidth")-50); outputs (this.backtop).css ("top", top + 300); $ ("body "). append (this. backtop) ;}, // create the return jquery object _ moveTo: function () {$ ("# back_top "). remove (); window. scroll () ;}};} (jQuery); var extend = function ($ cf, options) {for (var a in options) {$ cf [a] = options [a] ;}};
How to Use the jquery plug-in on the top of the rocket return?
Hello, This jquery plug-in is used in this way!
1. Import the jquery.js and top.js?cssfile top.css To Your webpage.
2. Add a line of html code to Your webpage: <a id = "returnTop" href = "javascript:;"> back to the top </a>
That's all!
Note: if you look at the content of top. js, you will understand why the id of the <a> label added is "returnTop.
Of course, you can change this id on your own, but remember to synchronize.
Bytes --------------------------------------------------------------------------------------------------
A question about jquery's return to the top
# Back-to-top {position: fixed; bottom: 150px; right: 30px ;}