Здравствуйте дорогие форумчане. Пожалуйста, оцените верстку. Сайт
http://training.od.ua/spyzer/index.html. Так же был бы благодарен, если бы подсказали на сколько ужасен этот код, и дали бы советы как его улучшить?
/******************* HEADER **********************/
$(window).on("scroll", function() {
if ($(window).scrollTop() > 100) {
if( $(window).width() > 767){
$('.login-form').clearQueue().fadeOut(200);
$('.logo').css('margin-top', '20px');
$('.logo img').css('width', '95px');
$('.nav-wrapper').css('margin-top', '40px');
}
}
if ($(window).scrollTop() < 100) {
if( $(window).width() > 767){
$('.nav-wrapper').css('margin-top', '130px');
$('.logo').css('margin-top', '51px');
$('.logo img').css('width', '408px');
if ($('.login-form').css('display') == 'none'){
$('.login-form').delay(600).fadeIn(300);
}
}
}
});
var headerSliderLabel = [];
var headerSlide = [];
$('.header-slider-buttons label').each( function(){
headerSliderLabel.push($(this))
})
$('.header-slider-wrapper .header-slide').each( function(){
headerSlide.push($(this))
})
var headerLabelLength = headerSliderLabel.length;
$('.header-slider-buttons label').on('click', function(){
var currentLabel = $(this);
for (var i = 0; i < headerLabelLength; i++) {
if (headerSliderLabel[i].attr('id') == currentLabel.attr('id')){
if( $(window).width() > 737){
headerSlide[i].children('.header-slide h2').clearQueue().delay(400).animate({'opacity':'1'},700);
headerSlide[i].children('.header-slide span').clearQueue().delay(400).animate({'opacity':'1'},1500);
var slideHeight= headerSlide[i].height()+50;
if (slideHeight > '290'){
$('.header-slider-wrapper').height(slideHeight);
}
else{
$('.header-slider-wrapper').css('height', '300px');
}
} else {
headerSlide[i].children('.header-slide h2').delay(400).animate({'opacity':'1'},700);
headerSlide[i].children('.header-slide span').delay(400).animate({'opacity':'1'},1500);
var slideHeight= headerSlide[i].height()+50;
if (slideHeight > '180'){
$('.header-slider-wrapper').height(slideHeight);
}
else{
$('.header-slider-wrapper').css('height', '180px');
}
}
}
else {
headerSlide[i].children('.header-slide h2').delay(200).animate({'opacity':'0'});
headerSlide[i].children('.header-slide span').delay(200).animate({'opacity':'0'});
}
}
})
$(document).ready( function(){
if( $(window).width() > 755){
$('.header-phone-wrapper').fadeIn(700);
$('.header-phone-wrapper').css('left', '150px');
}
else {
$('.header-phone-wrapper').fadeIn(700);
$('.header-phone-wrapper img').css('margin-right', 0);
}
$('#header-first-slide h2').animate({'opacity':'1'},700);
$('#header-first-slide span').animate({'opacity':'1'},1500);
if( $(window).width() > 737){
var slideHeight= $('#header-first-slide').height()+50;
if (slideHeight > '290'){
$('.header-slider-wrapper').height(slideHeight);
}
else{
$('.header-slider-wrapper').css('height', '300px');
}
}
else {
var slideHeight= $('#header-first-slide').height()+50;
if (slideHeight > '180'){
$('.header-slider-wrapper').height(slideHeight);
}
else{
$('.header-slider-wrapper').css('height', '180px');
}
}
});
/******* CIRCLE ANIMATION ************/
$(function() {
$("#circle1").knob();
$("#circle2").knob();
$("#circle3").knob();
});
var scrollCircleControl = true;
var currentNumber1 = $('#circle-number1 span').text();
var currentNumber2 = $('#circle-number2 span').text();
var currentNumber3 = $('#circle-number3 span').text();
var circlePosition = $('.container-two').offset();
var circleTop = circlePosition.top;
var scrineHeight = $(window).height();
$(window).on("scroll", function circleAnimation() {
if($(window).scrollTop() >= circleTop - scrineHeight && scrollCircleControl == true){
$({numberValue: currentNumber1}).animate({numberValue: 25}, {
duration: 1000,
easing: 'linear',
step: function() {
$('#circle-number1 span').text(Math.ceil(this.numberValue));
}
});
$({animatedVal: 0}).animate({animatedVal: 25}, {
duration: 1000,
easing: "linear",
step: function() {
$("#circle1").val(Math.ceil(this.animatedVal)).trigger("change");
}
});
$({numberValue: currentNumber2}).animate({numberValue: 50}, {
duration: 2000,
easing: 'linear',
step: function() {
$('#circle-number2 span').text(Math.ceil(this.numberValue));
}
});
$({animatedVal: 0}).animate({animatedVal: 50}, {
duration: 2000,
easing: "linear",
step: function() {
$("#circle2").val(Math.ceil(this.animatedVal)).trigger("change");
}
});
$({numberValue: currentNumber3}).animate({numberValue: 100}, {
duration: 4000,
easing: 'linear',
step: function() {
$('#circle-number3 span').text(Math.ceil(this.numberValue));
}
});
$({animatedVal: 0}).animate({animatedVal: 100}, {
duration: 4000,
easing: "linear",
step: function() {
$("#circle3").val(Math.ceil(this.animatedVal)).trigger("change");
}
});
scrollCircleControl = false;
}
});
/********** BOTTOM SLIDER ***********/
var scrollBottomControl = true;
var bottomSliderLabel = [];
var bottomSlide = [];
var bottomSliderPosition = $('.bottom-slider').offset();
var bottomSliderTop = bottomSliderPosition.top;
$('.bottom-slider-labels label').each( function(){
bottomSliderLabel.push($(this))
})
$('.bottom-slider .bottom-slide').each( function(){
bottomSlide.push($(this))
})
var bottomLabelLength = bottomSliderLabel.length;
$(window).on("scroll", function bottomSlider() {
if($(window).scrollTop() >= bottomSliderTop - scrineHeight && scrollBottomControl == true){
$('.bottom-slider div:first-child .bottom-slide-text h3').delay(600).animate({'top':'0'},700);
$('.bottom-slider div:first-child .bottom-slide-text p').delay(600).animate({'bottom':'0'},900);
scrollBottomControl = false;
}
})
$('.bottom-slider-labels label').on('click', function(){
var currentLabel = $(this);
for (var i = 0; i < bottomLabelLength; i++) {
if (bottomSliderLabel[i].attr('id') == currentLabel.attr('id')){
bottomSlide[i].children('.bottom-slide-text').children('h3').delay(400).animate({'top':'0'},700);
bottomSlide[i].children('.bottom-slide-text').children('p').delay(400).animate({'bottom':'0'},900);
}
else {
bottomSlide[i].children('.bottom-slide-text').children('h3').delay(400).animate({'top':'-55px'},700);
bottomSlide[i].children('.bottom-slide-text').children('p').delay(400).animate({'bottom':'-155px'},900);
}
}
})
/************** ANCHORS *****************/
$('a[href^="#"]').on('click', function () {
elementClick = $(this).attr("href");
$('html, body').animate({scrollTop: $(elementClick).offset().top}, 1000);
return false;
});
/********** MOBILE MENU **************************/
$('.mobile-nav-button').on('click', function(){
if( $(window).width() > 478){
if ($('.nav-wrapper nav').css('margin-right') != '0px'){
$('.nav-wrapper nav').css('margin-right', 0);
$('.mobile-nav-button').css('right', '215px');
}
else
{
$('.nav-wrapper nav').css('margin-right', '-210px');
$('.mobile-nav-button').css('right', '15px');
}
}
else {
if ($('.nav-wrapper nav').css('margin-right') != '0px'){
$('.nav-wrapper nav').css('margin-right', 0);
$('.mobile-nav-button').css('right', '160px');
}
else
{
$('.nav-wrapper nav').css('margin-right', '-210px');
$('.mobile-nav-button').css('right', '15px');
}
}
})
$('.nav-wrapper nav a').on('click', function(){
if( $(window).width() < 767 ){
$('.nav-wrapper nav').css('margin-right', '-210px');
$('.mobile-nav-button').css('right', '15px');
}
})
/************** SLIDER AUTO *****************/
function headerslider() {
var lastinput = $('input[name="header-slider"]:last').attr('id');
sliderplay = setInterval( function() {
if ($('input[name="header-slider"]:checked').attr('id') === lastinput) {
$('#header-slider-label1').click();
}
else {
var currentSlide = $('input[name="header-slider"]:checked').next().attr('id');
$('.header-slider-buttons label[for='+currentSlide+']').click();
}
},10000);
}
$(document).ready( headerslider() );
