Jquery implements the function _ jquery

What this article brings to you is to use javascript combined with jQuery to implement the function of returning to the top, and attach the source code to give it to you. Take away the required shoes directly. Today, we have developed a js jq function that is back to the top, not much nonsense. There are pictures and truth!

The Code is as follows:

(Function ($ ){
$. Fn. survey = function (options ){
Var defaults = {width: "298", height: "207 "};
Var options = $. extend (defaults, options );
If ($. browser. msie ){
Var ieVersion = parseInt ($. browser. version )}
// Create HTML
Var _ feedCreat = function (){
Var feedHtml = $ ('

');
FeedHtml.html (' \ U8fd4 \ u56de \ u9876 \ u90e8 \ U610f \ u89c1 \ u53cd \ u9988 ');
$ ("Body"). append (feedHtml );
_ Ie6Fixed ()
};
// Bind events
Var _ initEvent = function (){
$ (Window). resize (function (){
Var winW = $ (this). width ();
If (winW <= 1124) {$ ("# pubFeedBack"). hide ()}
Else {$ ("# pubFeedBack"). show ()}
});
$ (Window). bind ("scroll", function (){
If ($ (this). scrollTop ()> 50 ){
$ ("# BackTop" ).fadeIn().css ({"display": "block "})
}
Else {$ ("# backTop" 2.16.fadeout().css ({"display ":""})}
});
$ ("# BackTop"). bind ("click", function (e ){
E. preventDefault ();
$ ("Html, body"). scrollTop (0 )});
};
// Return to the top
Var _ tip = function (type, tipText ){
Var surveyTip = $ ("# D_SurveyTip"), surveyMask = $ ("# D_SurveyMask ");
If (! SurveyTip |! SurveyMask) {return}
SurveyTip. removeClass ("warning success" pai.addclass(type).html (tipText );
SurveyMask.css ("display", "block ");
SurveyTip.css ("display", "block ");
SetTimeout (function (){
SurveyMask.css ("display", "none"); surveyTip.css ("display", "none")}, 1000)
};
// Ie6 compatibility
Var _ ie6Fixed = function (){
If (ieVersion! = 6) {return}
Var surveyBox =$ ("# D_SurveyBox ");
Var pubFeedBack = $ ("# pubFeedBack ");
If (! SurveyBox |! PubFeedBack)
{
Return
}
$ (Window). bind ("scroll", function (){
Var h = $ (window ). height (), st = $ (window ). scrollTop (), _ top = h + st-options.height; var _top1?h=st-pubfeedback.height(%-15?surveybox.css ("top", _ top + "px ");
PubFeedBack.css ("top", _ top1 + "px ")
})
};
// Start execution
If (screen. width >=1280)
{
(Function (){
_ FeedCreat (); _ initEvent ()})()
}
}
}) (JQuery );
Window. onerror = function () {return false };
If ($. isFunction ($ (document). survey) {$ (document). survey ()}

The Code is as follows:

# BackTop I, # callSurvey I {background: url(survey.png) no-repeat ;}
# PubFeedBack {position: fixed; _ position: absolute; right: 15px; bottom: 15px; width: 54px; font-size: 12px ;}
# BackTop, # callSurvey {display: block; width: 52px; padding: 1px; height: 56px; line-height: 22px; text-align: center; color: # fff; text-decoration: none ;}
# BackTop {display: none; background: #999 ;}
# BackTop: hover {background: # ccc; zoom: 1; text-decoration: none; color: # fff ;}
# BackTop I {display: block; width: 25px; height: 13px; margin: 14px auto 8px; background-position:-63px 0 ;}
# CallSurvey {margin-top: 1px; background: #4107d9 ;}
# CallSurvey: hover {background: #66a4e3; zoom: 1; text-decoration: none; color: # fff ;}
# CallSurvey I {display: block; width: 26px; height: 25px; margin: 9px auto 0; background-position: 0 0 ;}
# CallSurvey: hover I {background-position:-30px 0 ;}

The code is very simple. You can directly put it in your own project. If you have any bugs, please leave a message and complete it together.

Method 2:

Main parameters:
ScrollName: 'scrollup', // Element ID
TopDistance: '200', // Distance from top before showing element (px)
TopSpeed: 300, // Speed back to top (MS)
Animation: 'fade ', // fade, slide, none
AnimationInSpeed: 200, // Animation in speed (MS)
AnimationOutSpeed: 200, // Animation out speed (MS)
ScrollText: 'scroll to top', // Text for element
ActiveOverlay: false,
// Helps you locate the page location to which the "Back to Top" button appears.

Jquery code (ScrollUp. js ):

$(function () {$.scrollUp({scrollName: 'scrollUp', // Element IDtopDistance: '300', // Distance from top before showing element (px)topSpeed: 300, // Speed back to top (ms)animation: 'fade', // Fade, slide, noneanimationInSpeed: 200, // Animation in speed (ms)animationOutSpeed: 200, // Animation out speed (ms)scrollText: 'Scroll to top', // Text for elementactiveOverlay: false, // set css color to display scrollup active point, e.g '#00ffff'});});