Fix stuff

This commit is contained in:
Edin Dazdarevic
2017-10-05 02:38:46 +02:00
parent b84bae2ba3
commit cfe769a5a6
5 changed files with 166 additions and 131 deletions

View File

@@ -4,6 +4,8 @@
Mobile:
[ ] - Our work slider not working
[X] - Our work slider not working
[ ] - More precise menu button
[ ] - Remove landing animation on mobile
[X] - Remove landing animation on mobile
[ ] - Use SVG logos
[X] - Collapse borders on how we work

View File

@@ -206,7 +206,7 @@ ul,p{
}
/*-----------------------------What we do-----------------------*/
.what-we-do{
padding: 230px 0;
padding: 230px 0px 70px;
position: relative;
top: -80px;
}
@@ -730,7 +730,8 @@ footer .back-to-top{
padding: 0;
}
.banner {
background-attachment: fixed;
/*background-attachment: fixed;*/
background-attachment: scroll;
}
.say-hi {
font-size: 26px;
@@ -745,7 +746,7 @@ footer .back-to-top{
font-size: 24px;
text-shadow: none;
opacity: 1;
top: 86%;
/*top: 86%;*/
height: auto;
}
.carousel-control.left, .carousel-control.right {
@@ -794,6 +795,7 @@ footer .back-to-top{
}
.border-box {
min-height: auto;
margin-bottom: -1px;
}
.med-title {
font-size: 23px;
@@ -809,7 +811,7 @@ footer .back-to-top{
}
.what-we-do {
padding: 100px 0;
padding: 100px 0px 0px;
position: relative;
top: -60px;
}

View File

@@ -40,17 +40,17 @@
<span></span>
</div>
</button>
<a class="navbar-brand animated" data-animation="fadeInLeft" data-animation-delay="0" href="#"><img src="img/logo.png" class="img-responsive hidden-xs" alt="logo"><img src="img/mob-logo.png" class="img-responsive visible-xs" alt="logo"></a>
<a class="navbar-brand animated123" href="#"><img src="img/logo.png" class="img-responsive hidden-xs" alt="logo"><img src="img/mob-logo.png" class="img-responsive visible-xs" alt="logo"></a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<div class="align-navbar">
<ul class="nav navbar-nav navbar-right animated" data-animation="fadeInRight" data-animation-delay="0" >
<li><a href="#">ABOUT</a></li>
<li><a href="#">WORK</a></li>
<li><a href="#">TEAM</a></li>
<ul class="nav navbar-nav navbar-right" >
<li><a href="#second" class="nav-link">ABOUT</a></li>
<li><a href="#work" class="nav-link">WORK</a></li>
<li><a href="#team" class="nav-link">TEAM</a></li>
<li class="hidden-xs"><a href="#"><i class="material-icons">&#xE0E1;</i></a></li>
<li class="visible-xs"><a href="#">CONTACT</a></li>
<li class="visible-xs"><a href="#contact" class="nav-link">CONTACT</a></li>
</ul>
</div>
</div>
@@ -64,7 +64,7 @@
<div class="row">
<div class="col-md-12 header-wrap">
<img src="img/suburly.png" class="img-responsive center-block visible-xs" alt="suburly">
<h1 data-animation="pulse" data-animation-delay="0">WE DESIGN AND BUILD<br> SOFTWARE</h1>
<h1>WE DESIGN AND BUILD<br> SOFTWARE</h1>
</div>
</div>
</div>
@@ -217,7 +217,7 @@
<!-- End How we work -->
<!-- Start Our work -->
<section class="our-work">
<section class="our-work" id="work">
<div class="container-fluid">
<div class="row" >
<div class="col-md-12" id="myCarousel" data-ride="carousel">
@@ -348,12 +348,12 @@
<p class="hint text-center">Mongo DB</p>
</div>
</div>
<div class="col-md-3 col-sm-3 space80">
<!-- <div class="col-md-3 col-sm-3 space80">
<div class="bg-color">
<img src="img/tech12.png" class="img-responsive center-block animated" data-animation="zoomIn" alt="tech12">
<img src="img/mysql.png" class="img-responsive center-block animated" data-animation="zoomIn" alt="tech12">
<p class="hint text-center">My SQL</p>
</div>
</div>
</div> -->
<div class="col-md-3 col-sm-3 space80">
<div class="bg-color">
<img src="img/tech12.png" class="img-responsive center-block animated" data-animation="zoomIn" alt="tech12">
@@ -393,7 +393,7 @@
<!-- Start team -->
<section class="team">
<section class="team" id="team">
<div class="container">
<div class="row">
<div class="col-md-12">
@@ -465,7 +465,7 @@
<!-- Start Form -->
<section class="form-section">
<section class="form-section" id="contact">
<div class="form-caption">
<div class="container">
<div class="row">
@@ -528,6 +528,7 @@
<script src="js/modernizr-2.5.3.min.js"></script>
<script src="js/jquery.appear.js"></script>
<script src="js/jquery.easing.min.js"></script>
<script src="js/jquery.bcSwipe.min.js"></script>
<script src="js/custom.js"></script>

View File

@@ -1,4 +1,29 @@
// $('.navbar-collapse a').click(function(){
// $(".navbar-collapse").collapse('hide');
// $('#nav-icon3').toggleClass('open');
// });
$('a.nav-link').click(function(e) {
var target = $($(this).attr("href"));
// x = position.left + parseInt($element.css('marginLeft'), 10);
var marginTop = parseInt(target.css('paddingTop'), 10);
$('html, body').animate({
// scrollTop: 700
scrollTop: target.offset().top - marginTop
}, 1000);
e.preventDefault();
return false;
// scrollTop: $("#myDiv").offset().top
});
if ($(window).width() < 767) {
$('.navbar-collapse a').click(function(){
$(".navbar-collapse").collapse('hide');
$('#nav-icon3').toggleClass('open');
});
$('.navbar-nav').removeClass('animated');
$('.above_item').addClass('carousel-inner');
$('#myCarousel').addClass('carousel slide');
@@ -16,54 +41,57 @@ if ($(window).width() < 767) {
$('.navbar-brand').removeClass('animated').attr('data-animation', '');
$(".go_there").prependTo($(".come_here"));
$('.carousel').bcSwipe({ threshold: 50 });
$(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');
// $(document).scroll(function() {
// TODO: revisit this
// 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);
// }
// });
hideControl();
// 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');
myCarousel.on('slid.bs.carousel', function() {
hideControl();
});
myCarousel.on('slide.bs.carousel', function() {
showControl();
});
// hideControl();
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
}
}
// myCarousel.on('slid.bs.carousel', function() {
// // hideControl();
// });
// myCarousel.on('slide.bs.carousel', function() {
// // showControl();
// });
function showControl() {
if (itemFirst.hasClass('active')) {
controlLeft.css('display', 'block');
}
if (itemLast.hasClass('active')) {
controlRight.css('display', 'block');
}
}
// 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');
// }
// }
}
@@ -132,7 +160,7 @@ $(document).ready(function() {
[1400, 5],
[1600, 5]
],
navigation: true, // Show next and prev buttons
navigation: false, // Show next and prev buttons
slideSpeed: 300,
paginationSpeed: 400,
dots: true,
@@ -150,15 +178,15 @@ $(document).ready(function() {
var bodyEl = $("body");
$(window).on("scroll", function() {
var scrollTop = $(this).scrollTop();
$("section").each(function() {
var el = $(this),
var el = $("#second"),
className = el.attr("id");
if (el.offset().top <= scrollTop) {
bodyEl.addClass(className);
} else {
bodyEl.removeClass(className);
}
});
});
@@ -276,84 +304,84 @@ $(document).ready(function() {
});
/*======================For Mobile Animation=======================*/
if ($(window).width() < 767) {
// if ($(window).width() < 767) {
$(document).ready(function() {
var fadeStart_mob = 400;
var fadeUntil_mob = 1000;
// $(document).ready(function() {
// var fadeStart_mob = 400;
// var fadeUntil_mob = 1000;
$(window).scroll(function() {
var offset_mob = $(document).scrollTop();
// $(window).scroll(function() {
// var offset_mob = $(document).scrollTop();
if (offset_mob < fadeStart_mob) {
$(".brush").css('top', "57");
$(".brush-shadow").css('top', "60");
// 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 >= 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");
// } 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");
// $(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");
}
});
});
// } 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");
// $(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");
}
});
});
// } 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");
// }
// });
// });
}
// }
/*

2
js/jquery.bcSwipe.min.js vendored Normal file
View File

@@ -0,0 +1,2 @@
/*! Bootstrap Carousel Swipe jQuery plugin v1.1 | https://github.com/maaaaark/bcSwipe | MIT License */
!function(t){t.fn.bcSwipe=function(e){var n={threshold:50};return e&&t.extend(n,e),this.each(function(){function e(t){1==t.touches.length&&(u=t.touches[0].pageX,c=!0,this.addEventListener("touchmove",o,!1))}function o(e){if(c){var o=e.touches[0].pageX,i=u-o;Math.abs(i)>=n.threshold&&(h(),t(this).carousel(i>0?"next":"prev"))}}function h(){this.removeEventListener("touchmove",o),u=null,c=!1}var u,c=!1;"ontouchstart"in document.documentElement&&this.addEventListener("touchstart",e,!1)}),this}}(jQuery);