function floorMove(floors, floorNav) {
this.floors = $(floors);
this.floorNav = $(floorNav);
}
floorMove.prototype = {
constructor: floorMove,
CscrollTop: $(window).scrollTop(),
floorTop: function (floor) {
var floorTops = [];
var floors = this.floors.find(floor);
for (var i = 0; i < floors.length; i++) {
floorTops[i] = floors[i].offsetTop;
}
console.log(floorTops);
return floorTops;
},
Cwidth: $(window).width(),
Cheigth: $(window).height(),
//窗口大小改变高宽
findDimensions: function () {
if (window.innerWidth) {
this.Cwidth = window.innerWidth;
}
else if ((document.body) && (document.body.clientWidth)) {
this.Cwidth = document.body.clientWidth;
}
if (window.innerHeight) {
this.Cheigth = window.innerHeight;
}
else if ((document.body) && (document.body.clientHeight)) {
this.Cheigth = document.body.clientHeight;
}
if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth) {
this.Cheigth = document.documentElement.clientHeight;
this.Cwidth = document.documentElement.clientWidth;
}
console.log(this.Cwidth);
},
//nav显示还是隐藏
floorNavShow: function () {
if (this.CscrollTop > (this.floorTops[0] - 255) && this.Cwidth > 1200) {
this.floorNav.show("fast");
if (this.Cwidth > 1300) {
this.floorNav.css({
"left": ((this.Cwidth - 1180) / 2 - 55) + "px"
});
} else if (this.Cwidth < 1300 && this.Cwidth > 1200) {
this.floorNav.css({
"left": ((this.Cwidth - 1180) / 2 - 40) + "px"
});
} else {
this.floorNav.hide();
}
} else {
this.floorNav.hide("fast");
}
console.log(1111111111);
},
floorColor: function () {
var CscrollTops = this.CscrollTop;
console.log(122222222222);
var floor = this.floors.find("div");
console.log(floor[1]);
var floor1 = floor[1].offsetTop;
console.log(floor1);
var floorTops = [];
var floorColor = ["#f1a849", "#bc8bfe", "#6f6bfe", "#21ca91", "#df71c8", "#3c9edf"];
var floorNavLi = this.floorNav.find("li");
CscrollTops = $(window).scrollTop();
floor.each(function (index) {
floorTops[index] = floor[index].offsetTop;
floorNavLi.eq(index).hover(function () {
$(this).css({
"background": floorColor[index],
"color": "#fff"
});
}, function () {
if (CscrollTops > (floorTops[index] - 255) && CscrollTops < (floorTops[index + 1]) - 255) {
$(this).css({
"background": floorColor[index],
"color": "#000"
}).siblings().css({
"background": "#fff",
"color": "#b0b0b0"
});
} else if (CscrollTops > (floorTops[floor.length - 1] - 255)) {
floorNavLi.eq(floor.length - 1).css({
"background": floorColor[index + 1],
"color": "#fff"
}).siblings().css({
"background": "#fff",
"color": "#b0b0b0"
});
}
});
floorNavLi.eq(index).click(function () {
$(this).css({
"background": floorColor[index],
"color": "#fff"
}).siblings().css({
"background": "#fff",
"color": "#b0b0b0"
});
$("html,body").animate({
scrollTop: floorTops[index]
}, 300).dequeue();
})
})
},
};
var jtFloorMove = new floorMove(".floors", "#floorsId");
$(window).scroll(function () {
jtFloorMove.floorColor();
});
jtFloorMove.floorTop(".floor");
jtFloorMove.floorColor();
window.onresize = function () {
jtFloorMove.findDimensions();
jtFloorMove.floorNavShow();
};
添加回答
举报
0/150
提交
取消