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 returned after the current creation
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 );*/
Certificate (this.backtop).css ("zIndex", 1000 );
Certificate (this.backtop).css ("position", "absolute ");
Vertex (this.backtop).css ("cursor", "pointer ");
$ (This. backtop). width (30 );
$ (This. backtop). height (30 );
Attributes (this.backtop).css ("left", $ ("body"). attr ("clientWidth")-50 );
Certificate (this.backtop).css ("top", top + 300 );
$ ("Body"). append (this. backtop );
}, // Create a jquery object that returns the top
_ MoveTo: function (){
$ ("# Back_top"). remove ();
Window. scroll (0, 0 );
}
};
}) (JQuery );
Var extend = function ($ cf, options ){
For (var a in options ){
$ Cf [a] = options [a];
}
};
Author: Zhang Hui