First version
This commit is contained in:
Edin Dazdarevic
383
js/custom.js
Normal file
383
js/custom.js
Normal file
@@ -0,0 +1,383 @@
|
||||
if ($(window).width() < 767) {
|
||||
$('.navbar-nav').removeClass('animated');
|
||||
$('.above_item').addClass('carousel-inner');
|
||||
$('#myCarousel').addClass('carousel slide');
|
||||
$('.border-box2').addClass('item');
|
||||
$('.border-box2:first-child').addClass('active');
|
||||
$('.owl_id').attr('id', 'owl-demo');
|
||||
$('.owl_id .col-sm-3').addClass('item')
|
||||
$('.owl_id .col-sm-3:first-child').addClass('active');
|
||||
|
||||
$('.our-work').find('.border-box2').removeClass('animated');
|
||||
|
||||
$('.how-we-work').find('.border-box').attr('data-animation', 'fadeInUp');
|
||||
|
||||
$('.technology').find('.animated').removeClass('animated');
|
||||
|
||||
$('.navbar-brand').removeClass('animated').attr('data-animation', '');
|
||||
$(".go_there").prependTo($(".come_here"));
|
||||
|
||||
$(document).scroll(function() {
|
||||
if (window.scrollY > 50) {
|
||||
$(".header-wrap").stop().animate({
|
||||
zoom: 0.5
|
||||
});
|
||||
$(".header-wrap").css("opacity", 1 - $(window).scrollTop() / 250);
|
||||
} else {
|
||||
$(".header-wrap").stop().animate({
|
||||
zoom: 1
|
||||
});
|
||||
$(".header-wrap").css("opacity", 1);
|
||||
}
|
||||
});
|
||||
|
||||
var myCarousel = $('#myCarousel');
|
||||
var itemFirst = myCarousel.find('.carousel-inner > .item:first-child');
|
||||
var itemLast = myCarousel.find('.carousel-inner > .item:last-child');
|
||||
var controlLeft = myCarousel.find('a.left.carousel-control');
|
||||
var controlRight = myCarousel.find('a.right.carousel-control');
|
||||
|
||||
hideControl();
|
||||
|
||||
myCarousel.on('slid.bs.carousel', function() {
|
||||
hideControl();
|
||||
});
|
||||
myCarousel.on('slide.bs.carousel', function() {
|
||||
showControl();
|
||||
});
|
||||
|
||||
function hideControl() {
|
||||
if (itemFirst.hasClass('active')) {
|
||||
controlLeft.css('display', 'none');
|
||||
}
|
||||
if (itemLast.hasClass('active')) {
|
||||
controlRight.css('display', 'none');
|
||||
myCarousel.carousel('pause'); // stop from cycling through items
|
||||
}
|
||||
}
|
||||
|
||||
function showControl() {
|
||||
if (itemFirst.hasClass('active')) {
|
||||
controlLeft.css('display', 'block');
|
||||
}
|
||||
if (itemLast.hasClass('active')) {
|
||||
controlRight.css('display', 'block');
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
$('a.back-to-top').click(function() {
|
||||
$('html, body').animate({
|
||||
scrollTop: 0
|
||||
}, 700);
|
||||
return false;
|
||||
});
|
||||
|
||||
|
||||
//appear animedted...............
|
||||
$('.animated').appear(function() {
|
||||
var elem = $(this);
|
||||
var animation = elem.data('animation');
|
||||
if (!elem.hasClass('visible')) {
|
||||
var animationDelay = elem.data('animation-delay');
|
||||
if (animationDelay) {
|
||||
|
||||
setTimeout(function() {
|
||||
elem.addClass(animation + " visible");
|
||||
}, animationDelay);
|
||||
|
||||
} else {
|
||||
elem.addClass(animation + " visible");
|
||||
}
|
||||
}
|
||||
});
|
||||
//end appear animedted...............
|
||||
|
||||
$(document).ready(function() {
|
||||
$('#nav-icon3').click(function() {
|
||||
$(this).toggleClass('open');
|
||||
});
|
||||
|
||||
$('.readmore').click(function() {
|
||||
$(this).siblings('.details2').slideToggle();
|
||||
});
|
||||
$('.readmore').click(function() {
|
||||
if ($(this).text() == 'Read more') {
|
||||
$(this).text('Read less');
|
||||
} else {
|
||||
$(this).text('Read more');
|
||||
}
|
||||
});
|
||||
$('.readmore').click(function() {
|
||||
$(this).toggleClass('arrow-up');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
$(document).ready(function() {
|
||||
$("#owl-demo").owlCarousel({
|
||||
autoPlay: 3000, //Set AutoPlay to 3 seconds
|
||||
items: 1,
|
||||
loop: true,
|
||||
itemsCustom: [
|
||||
[0, 3],
|
||||
[320, 3],
|
||||
[480, 3],
|
||||
[768, 3],
|
||||
[1200, 4],
|
||||
[1400, 5],
|
||||
[1600, 5]
|
||||
],
|
||||
navigation: true, // Show next and prev buttons
|
||||
slideSpeed: 300,
|
||||
paginationSpeed: 400,
|
||||
dots: true,
|
||||
|
||||
|
||||
navigationText: [
|
||||
"<img src='img/left.png'>",
|
||||
"<img src='img/right.png'>"
|
||||
],
|
||||
pagination: true,
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
var bodyEl = $("body");
|
||||
$(window).on("scroll", function() {
|
||||
var scrollTop = $(this).scrollTop();
|
||||
$("section").each(function() {
|
||||
var el = $(this),
|
||||
className = el.attr("id");
|
||||
if (el.offset().top <= scrollTop) {
|
||||
bodyEl.addClass(className);
|
||||
} else {
|
||||
bodyEl.removeClass(className);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
var fadeStart = 900;
|
||||
var fadeUntil = 1300;
|
||||
|
||||
|
||||
|
||||
$(window).scroll(function() {
|
||||
var offset = $(document).scrollTop();
|
||||
|
||||
|
||||
if (offset < fadeStart) {
|
||||
$(".brush").css('left', "25");
|
||||
$(".brush-shadow").css('left', "25");
|
||||
|
||||
} else if (offset >= fadeStart && offset <= fadeUntil) {
|
||||
$(".brush").animate({
|
||||
left: "75",
|
||||
}, 3000, function() {});
|
||||
$(".brush-shadow").animate({
|
||||
left: "55",
|
||||
}, 4000, function() {});
|
||||
|
||||
} else if (offset > fadeUntil) {
|
||||
$(".brush").css('left', "75");
|
||||
$(".brush-shadow").css('left', "55");
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
var fadeStart1 = 1400;
|
||||
var fadeUntil1 = 2000;
|
||||
|
||||
|
||||
|
||||
$(window).scroll(function() {
|
||||
var offset1 = $(document).scrollTop();
|
||||
|
||||
|
||||
if (offset1 < fadeStart1) {
|
||||
$(".box-img").css('right', "20");
|
||||
$(".box-img-shadow").css('right', "20");
|
||||
|
||||
} else if (offset1 >= fadeStart1 && offset1 <= fadeUntil1) {
|
||||
$(".box-img").animate({
|
||||
right: "150",
|
||||
}, 3000, function() {});
|
||||
$(".box-img-shadow").animate({
|
||||
right: "130",
|
||||
}, 3500, function() {});
|
||||
|
||||
} else if (offset1 > fadeUntil1) {
|
||||
$(".box-img").css('right', "150");
|
||||
$(".box-img-shadow").css('right', "130");
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
var fadeStart2 = 2300;
|
||||
var fadeUntil2 = 2700;
|
||||
|
||||
|
||||
|
||||
$(window).scroll(function() {
|
||||
var offset2 = $(document).scrollTop();
|
||||
|
||||
|
||||
if (offset2 < fadeStart2) {
|
||||
$(".hand").css({
|
||||
'left': '50',
|
||||
'top': '130'
|
||||
});
|
||||
$(".hand-shadow").css({
|
||||
'left': '50',
|
||||
'top': '130'
|
||||
});
|
||||
|
||||
} else if (offset2 >= fadeStart2 && offset2 <= fadeUntil2) {
|
||||
$(".hand").animate({
|
||||
left: "70",
|
||||
top: "150",
|
||||
}, 3000, function() {});
|
||||
$(".hand-shadow").animate({
|
||||
left: "60",
|
||||
top: "140",
|
||||
}, 3500, function() {});
|
||||
|
||||
} else if (offset2 > fadeUntil2) {
|
||||
$(".hand").css({
|
||||
'left': '70',
|
||||
'top': '150'
|
||||
});
|
||||
$(".hand-shadow").css({
|
||||
'left': '60',
|
||||
'top': '140'
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
/*======================For Mobile Animation=======================*/
|
||||
if ($(window).width() < 767) {
|
||||
|
||||
$(document).ready(function() {
|
||||
var fadeStart_mob = 400;
|
||||
var fadeUntil_mob = 1000;
|
||||
|
||||
$(window).scroll(function() {
|
||||
var offset_mob = $(document).scrollTop();
|
||||
|
||||
if (offset_mob < fadeStart_mob) {
|
||||
$(".brush").css('top', "57");
|
||||
$(".brush-shadow").css('top', "60");
|
||||
|
||||
} else if (offset_mob >= fadeStart_mob && offset_mob <= fadeUntil_mob) {
|
||||
$(".brush").animate({
|
||||
top: "27",
|
||||
}, 5000, function() {});
|
||||
$(".brush-shadow").animate({
|
||||
top: "37",
|
||||
}, 6000, function() {});
|
||||
|
||||
} else if (offset_mob > fadeUntil_mob) {
|
||||
$(".brush").css('top', "57");
|
||||
$(".brush-shadow").css('top', "60");
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
$(document).ready(function() {
|
||||
var fadeStart_mob1 = 800;
|
||||
var fadeUntil_mob1 = 1300;
|
||||
$(window).scroll(function() {
|
||||
var offset_mob1 = $(document).scrollTop();
|
||||
if (offset_mob1 < fadeStart_mob1) {
|
||||
$(".box-img").css('top', "50");
|
||||
$(".box-img-shadow").css('top', "55");
|
||||
|
||||
} else if (offset_mob1 >= fadeStart_mob1 && offset_mob1 <= fadeUntil_mob1) {
|
||||
$(".box-img").animate({
|
||||
top: "20",
|
||||
}, 5000, function() {});
|
||||
$(".box-img-shadow").animate({
|
||||
top: "30",
|
||||
}, 6000, function() {});
|
||||
} else if (offset_mob1 > fadeUntil_mob1) {
|
||||
$(".box-img").css('top', "50");
|
||||
$(".box-img-shadow").css('top', "55");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$(document).ready(function() {
|
||||
var fadeStart_mob2 = 1100;
|
||||
var fadeUntil_mob2 = 1700;
|
||||
$(window).scroll(function() {
|
||||
var offset_mob2 = $(document).scrollTop();
|
||||
if (offset_mob2 < fadeStart_mob2) {
|
||||
$(".hand").css('top', "60");
|
||||
$(".hand-shadow").css('top', "65");
|
||||
|
||||
} else if (offset_mob2 >= fadeStart_mob2 && offset_mob2 <= fadeUntil_mob2) {
|
||||
$(".hand").animate({
|
||||
top: "20",
|
||||
}, 5000, function() {});
|
||||
$(".hand-shadow").animate({
|
||||
top: "30",
|
||||
}, 6000, function() {});
|
||||
} else if (offset_mob2 > fadeUntil_mob2) {
|
||||
$(".hand").css('top', "60");
|
||||
$(".hand-shadow").css('top', "65");
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
|
||||
$(window).scroll(function(){
|
||||
var offset3 = $(document).scrollTop();
|
||||
|
||||
|
||||
if (offset3 > 50) {
|
||||
$('.go_away').animate({
|
||||
top: '-50px',
|
||||
opacity: '0.5',
|
||||
},500)
|
||||
|
||||
}else if (offset3 < 50) {
|
||||
$('.go_away').animate({
|
||||
top: '0',
|
||||
opacity: '1',
|
||||
},200)
|
||||
}
|
||||
|
||||
});
|
||||
});*/
|
||||
Reference in New Issue
Block a user