JQuery back to the top plug-in jQuery GoUp, jquerygoup

JQuery back to the top plug-in jQuery GoUp, jquerygoup

Plug-in description

JQuery GoUp! Is a simple jQuery plug-in that allows your webpage users to directly return to the top.

Easy to use

Reference jquery library and jquery. goup. min. js to your page

<script type="text/javascript" src="jquery.min.js"></script><script type="text/javascript" src="jquery.goup.min.js"></script>

After the plug-in is called, it will be OK.

<Script type = "text/javascript"> $ (document ). ready (function () {$. goup ({trigger: 100, bottomOffset: 20, // The offset locationOffset: 30 from the bottom, // The offset from the right: 'back to the top', titleAsText: true // whether the title is displayed}); </script>

Effect

JQuery GoUp: http://download.csdn.net/detail/itmyhome/7714581

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

Add callback for jquery plug-in development

Your plug-in should not return with return, because you do not need to get a value, but directly set CSS

Var _ this = $ (this) is unnecessary.

(Function ($ ){
$. Fn. MyCss = function (options, callback ){
Var defaults = {
Bd: '#000 ',
Cl: 'red'
};
Var opts = $. extend (defaults, options );
$ (This). each (function (){
Background (this).css ({'background ': opts. bd, 'color': opts. cl });
});
If (callback ){
Callback ();
}
};
}) (JQuery );

When callback is used, the subsequent function is the callback function.

$ (Function (){
$ ("# Foo,. bar"). MyCss ({}, function (){
Alert ("CSS setting successful ");
});
});