//入口main-data檔案代碼,在頁面中直接引入入口檔案即可
requirejs.config({
paths:{
jquery:"jquery-1.12.4"
}
});<span style="font-family: Arial, Helvetica, sans-serif;">//path定義我們的路徑</span>
requirejs(["jquery","BackTop","scrollTo"],function($,BackTop,scrollTo){ //引入我們要依賴的子產品檔案
new BackTop.BackTop($(".sidebar_up"),{
mode:"move",
pos:$(window).height(),
speed:2000
});
var scroll_0 = new scrollTo.ScrollTo({dest:550,speed:1000});
$("#floor_0").on("click",$.proxy(scroll_0.move,scroll_0));
var scroll_1 = new scrollTo.ScrollTo({dest:1150,speed:1000});
$("#floor_1").on("click",$.proxy(scroll_1.move,scroll_1));
var scroll_2 = new scrollTo.ScrollTo({dest:550,speed:1000});
$("#floor_2").on("click",$.proxy(scroll_2.move,scroll_2));
var scroll_3 = new scrollTo.ScrollTo({dest:2500,speed:1000});
$("#floor_3").on("click",$.proxy(scroll_3.move,scroll_3));
});
//定義編寫子產品檔案ScrollTo.js
<pre name="code" class="javascript">define(["jquery"], function($) {
function ScrollTo(opts) {
this.opts = $.extend({}, scrollTo.DEFAULTS, opts);
this.$el = $("html,body");
}
ScrollTo.prototype.move = function() {
var opts = this.opts;
var dest = opts.dest;
if($(window).scrollTop() != dest) {
if(!this.$el.is(":animated")) {
this.$el.animate({
scrollTop: dest
}, opts.speed);
}
}
};
ScrollTo.prototype.go = function() {
var dest = this.opts.dest;
if($(window).scrollTop() != dest) {
this.$el.scrollTop(dest);
}
};
ScrollTo.DEFAULTS = {
dest: 0,
speed: 800
};
return {
ScrollTo: ScrollTo
};
});
//定義編寫子產品檔案BackTo.js
define(["jquery", "scrollTo"], function($, scrollTo) {
function BackTop(el, opts) {
this.opts = $.extend({}, BackTop.DEFAULTS, opts);
this.$el = $(el);
this.scroll = new scrollTo.ScrollTo({
dest: 0,
speed: this.opts.speed
});
this._checkPosition();
if(this.opts.mode == "move") {
this.$el.on("click", $.proxy(this._move, this));
} else {
this.$el.on("click", $.proxy(this._go, this));
}
$(window).on("scroll", $.proxy(this._checkPosition, this));
}
BackTop.DEFAULTS = {
mode: "move",
pos: $(window).height(),
speed: 800
};
BackTop.prototype._move = function() {
this.scroll.move();
};
BackTop.prototype._go = function() {
this.scroll.go();
};
BackTop.prototype._checkPosition = function() {
var $el = this.$el;
if($(window).scrollTop() > this.opts.pos) {
$el.fadeIn();
} else {
$el.fadeOut();
}
};
$.fn.extend({
backtop: function(opts) {
return this.each(function() {
new BackTop(this, opts);
});
}
});
return {
BackTop: BackTop
};
});