"272"
Bootstrap 4.1.1 Snippet by sumi9xm

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="img/ico" href='images/favicon.png'>
<title>hitgoalz</title>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/font-awesome.css">
<link rel="stylesheet" href="css/style.css">
<script src="js/jquery-3.1.1.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/hitgoalz.js"></script>
</head>
<body class="add_overlay">
<!-- ======================== SCROOL UP===========================-->
<div class="scrollup" href="#" style="display: block;"><img class="img-fluid" src="images/top-arrow.png"></div>
<script>
// scrolltop
$('.scrollup').click(function (){
$("html,body").animate({
scrollTop: 0
}, 1000);
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
@font-face {
font-family: 'TitilliumWeb';
src: url(../font-style/TitilliumWeb-Light.ttf) format('truetype');
}
@font-face {
font-family: 'Comfortaa';
src: url(../font-style/Comfortaa-Regular.ttf) format('truetype');
}
body{
background-color: #edede8;
transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
}
body.overlay:before {
content: "";
position: fixed;
background: rgba(0, 0, 0, 0.8);
width: 100%;
height: 100%;
z-index: 9999;
transition-duration: 4s;
transition-delay: 2s;
}
/*===========================SUPPORT CLASS===========================*/
@media (min-width: 1366px){
.nav-container {
max-width: 1320px;
}
}
.trans{
transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
$(document).ready(function () {
$(document).on('click', '.cta', function () {
$(this).toggleClass('active')
})
});
$(document).ready(function(){
$(".hamburger").click(function(){
$('.add_overlay').toggleClass('overlay');
if ($('.ul_animated').hasClass('nav-fade')) {
$('.sidebar-menu').addClass("full-side-bar");
$('.ul_animated').removeClass('fadeInDown');
$('.ul_animated').addClass("fadeInUp");
$('.ul_animated').removeClass('nav-fade');
} else {
$('.ul_animated').addClass("fadeInDown");
setTimeout(function() {
$('.sidebar-menu').removeClass("full-side-bar");
},300);
$('.ul_animated').removeClass('fadeInUp');
$('.ul_animated').addClass('nav-fade');
}
//$('.ul_animated').toggleClass("fadeInUp");
});
});
//Overlay===============================
$(document).ready(function() {
$('.overlay').click(function() {
$('.sidebar-menu').removeClass("full-side-bar");
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: