Scribd
Upload
24 views

Index - HTML 3

All

Uploaded by

orjinolly
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
24 views

Index - HTML 3

All

Uploaded by

orjinolly
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 19

<!

DOCTYPE html>
<html lang="zxx">

<meta http-equiv="content-type" content="text/html;charset=UTF-8" />


<head>
<title>Fedex Courier Services :: Home </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<meta name="keywords" content="Shipment a Responsive web template, Bootstrap
Web Templates, Flat Web Templates, Android Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG,
SonyEricsson, Motorola web design" />
<script>
addEventListener("load", function() {
setTimeout(hideURLbar, 0);
}, false);

function hideURLbar() {
window.scrollTo(0, 1);
}
</script>
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
<link href="css/style.css" rel='stylesheet' type='text/css' />
<link rel="stylesheet" href="css/owl.theme.css" type="text/css" media="all">
<link rel="stylesheet" href="css/owl.carousel.css" type="text/css"
media="screen" property="" />
<link href="css/prettyPhoto.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="css/minimal-slider.css" type="text/css"
media="all" />
<link href="css/fontawesome-all.css" rel="stylesheet">
<link href="http://fonts.googleapis.com/css?
family=Josefin+Sans:100,100i,300,300i,400,400i,600,600i,700,700i" rel="stylesheet">
<link href="http://fonts.googleapis.com/css?
family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800"
rel="stylesheet">
</head>

<body>
<script>
(function(){
if(typeof _bsa !== 'undefined' && _bsa) {
// format, zoneKey, segment:value, options
_bsa.init('flexbar', 'CKYI627U', 'placement:w3layoutscom');
}
})();
</script>
<script>
(function(){
if(typeof _bsa !== 'undefined' && _bsa) {
// format, zoneKey, segment:value, options
_bsa.init('fancybar', 'CKYDL2JN', 'placement:demo');
}
})();
</script>
<body>
<div class="mian-content">
<!-- main image slider container -->
<div class="slide-window">
<div class="slide-wrapper" style="width: 300%;">
<div class="slide">
<div class="slide-caption">
<h3>Have a <span>package</span>?.</h3>
<div class="cont-btn">
<a class="btn text-uppercase" href="#" data-
toggle="modal" data-target="#exampleModalCenter">
Track</a>
</div>

</div>
</div>
<div class="slide slide2">
<div class="slide-caption">
<h3>Premium Worldwide <span>Logistics</span> Network </h3>
<div class="cont-btn">
<a class="btn text-uppercase" href="contact.html">
Contact</a>
</div>

</div>
</div>
<div class="slide slide3">
<div class="slide-caption">
<h3>Propel <span>yourself</span> into the future.</h3>
<div class="cont-btn">
<a class="btn text-uppercase" href="contact.html">
Contact</a>
</div>

</div>
</div>
</div>
<div class="slide-controller">
<div class="slide-control-left">
<div class="slide-control-line"></div>
<div class="slide-control-line"></div>
</div>
<div class="slide-control-right">
<div class="slide-control-line"></div>
<div class="slide-control-line"></div>
</div>
</div>
</div>
<!-- main image slider container -->

<div class="header-top-w3layouts">
<div class="container">

<header>
<div class="top-head-w3-agile text-left">
<div class="row top-content-info-wthree">
<div class="col-lg-5 top-content-left">
<h6>Have any Questions?</h6>
</div>
<div class="col-lg-7 top-content-right">
<div class="row">
<div class="col-md-6 callnumber text-left">
<h6>Call Us : <span><a href="tel:
+14094226132">+14094226132</a></span></h6>

</div>
<div class="col-md-6 top-social-icons p-0">
<!-- GTranslate: https://gtranslate.io/ -->
<style type="text/css">
<!--
a.gflag {vertical-align:middle;font-size:24px;padding:1px 0;background-repeat:no-
repeat;background-image:url(//gtranslate.net/flags/24.png);}
a.gflag img {border:0;}
a.gflag:hover {background-image:url(//gtranslate.net/flags/24a.png);}
#goog-gt-tt {display:none !important;}
.goog-te-banner-frame {display:none !important;}
.goog-te-menu-value:hover {text-decoration:none !important;}
body {top:0 !important;}
#google_translate_element2 {display:none!important;}
-->
</style>

<br /><select onchange="doGTranslate(this);"><option value="">Select


Language</option><option value="en|af">Afrikaans</option><option value="en|
sq">Albanian</option><option value="en|ar">Arabic</option><option value="en|
hy">Armenian</option><option value="en|az">Azerbaijani</option><option value="en|
eu">Basque</option><option value="en|be">Belarusian</option><option value="en|
bg">Bulgarian</option><option value="en|ca">Catalan</option><option value="en|zh-
CN">Chinese (Simplified)</option><option value="en|zh-TW">Chinese
(Traditional)</option><option value="en|hr">Croatian</option><option value="en|
cs">Czech</option><option value="en|da">Danish</option><option value="en|
nl">Dutch</option><option value="en|en">English</option><option value="en|
et">Estonian</option><option value="en|tl">Filipino</option><option value="en|
fi">Finnish</option><option value="en|fr">French</option><option value="en|
gl">Galician</option><option value="en|ka">Georgian</option><option value="en|
de">German</option><option value="en|el">Greek</option><option value="en|
ht">Haitian Creole</option><option value="en|iw">Hebrew</option><option value="en|
hi">Hindi</option><option value="en|hu">Hungarian</option><option value="en|
is">Icelandic</option><option value="en|id">Indonesian</option><option value="en|
ga">Irish</option><option value="en|it">Italian</option><option value="en|
ja">Japanese</option><option value="en|ko">Korean</option><option value="en|
lv">Latvian</option><option value="en|lt">Lithuanian</option><option value="en|
mk">Macedonian</option><option value="en|ms">Malay</option><option value="en|
mt">Maltese</option><option value="en|no">Norwegian</option><option value="en|
fa">Persian</option><option value="en|pl">Polish</option><option value="en|
pt">Portuguese</option><option value="en|ro">Romanian</option><option value="en|
ru">Russian</option><option value="en|sr">Serbian</option><option value="en|
sk">Slovak</option><option value="en|sl">Slovenian</option><option value="en|
es">Spanish</option><option value="en|sw">Swahili</option><option value="en|
sv">Swedish</option><option value="en|th">Thai</option><option value="en|
tr">Turkish</option><option value="en|uk">Ukrainian</option><option value="en|
ur">Urdu</option><option value="en|vi">Vietnamese</option><option value="en|
cy">Welsh</option><option value="en|yi">Yiddish</option><option value="en|
ceb">Cebuano</option><option value="en|eo">Esperanto</option><option value="en|
gu">Gujarati</option><option value="en|ig">Igbo</option><option value="en|
jw">Javanese</option></select><div id="google_translate_element2"></div>
<script type="text/javascript">
function googleTranslateElementInit2() {new
google.translate.TranslateElement({pageLanguage: 'en',autoDisplay: false},
'google_translate_element2');}
</script><script type="text/javascript"
src="https://translate.google.com/translate_a/element.js?
cb=googleTranslateElementInit2"></script>

<script type="text/javascript">
/* <![CDATA[ */
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c
%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String))
{while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\
w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\
b','g'),k[c]);return p}('6 7(a,b){n{4(2.9){3 c=2.9("o");c.p(b,f,f);a.q(c)}g{3
c=2.r();a.s(\'t\'+b,c)}}u(e){}}6 h(a){4(a.8)a=a.8;4(a==\'\')v;3 b=a.w(\'|\')[1];3
c;3 d=2.x(\'y\');z(3 i=0;i<d.5;i++)4(d[i].A==\'B-C-D\')c=d[i];4(2.j(\'k\')==E||
2.j(\'k\').l.5==0||c.5==0||c.l.5==0){F(6()
{h(a)},G)}g{c.8=b;7(c,\'m\');7(c,\'m\')}}',43,43,'||document|var|if|length|
function|GTranslateFireEvent|value|createEvent||||||true|else|doGTranslate||
getElementById|google_translate_element2|innerHTML|change|try|HTMLEvents|initEvent|
dispatchEvent|createEventObject|fireEvent|on|catch|return|split|
getElementsByTagName|select|for|className|goog|te|combo|null|setTimeout|
500'.split('|'),0,{}))
/* ]]> */
</script>

</div>
</div>
</div>

</div>
</div>
<div class="clearfix"></div>
<nav class="navbar navbar-expand-lg navbar-light">
<div class="logo text-left">
<h1>
<a class="navbar-brand" href="index.html">
<img src="images/logo.png" height="50"></a>
</h1>
</div>
<button class="navbar-toggler" type="button" data-
toggle="collapse" data-target="#navbarSupportedContent" aria-
controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle
navigation">
<span class="navbar-toggler-icon">

</span>

</button>

<div class="collapse navbar-collapse"


id="navbarSupportedContent">
<ul class="navbar-nav ml-lg-auto text-right">
<li class="nav-item active">
<a class="nav-link" href="index.html">Home
<span class="sr-only">(current)</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">About</a>
</li>
<li class="nav-item">
<a class="nav-link"
href="contact.html">Contact</a>
</li>

</ul>

<div class="log-in">
<a class="btn text-uppercase" href="#" data-
toggle="modal" data-target="#exampleModalCenter">
TRACK</a>
</div>
</div>

</nav>
</header>
</div>
</div>

</div>
<!-- end of main image slider container -->
<!-- banner-text -->
<!-- ab -->
<section class="banner-bottom-w3ls py-lg-5 py-md-5 py-3">
<div class="container">
<!---728x90--->

<div class="inner-sec-w3layouts py-lg-5 py-3">


<div class="intro text-left">
<h3 class="main mb-md-5 mb-3">The market place for shippers and
transporters</h3>
<p>Our goal is to create a product and service that you're
satisfied with ,and you'll use everyday.This is why
we're constantly working on our services to make it
dynamic.
</p>
</div>
<div class="row mt-lg-5 mt-md-4 mt-4">
<div class="col-lg-4 about-in text-left">
<div class="card">
<div class="card-body">
<i class="fas fa-anchor mb-2"></i>

<h5 class="card-title">Ocean Freight</h5>


<!-- <p class="card-text">Lorem ipsum dolor sit
amet consectetur elit,Adipisicing elit tempor.</p> -->
</div>
</div>

</div>
<div class="col-lg-4 about-in text-left">
<div class="card">
<div class="card-body">

<i class="fas fa-fighter-jet mb-2"></i>

<h5 class="card-title">Air Freight</h5>


<!-- <p class="card-text">Lorem ipsum dolor sit
amet consectetur elit,Adipisicing elit tempor.</p> -->
</div>
</div>
</div>

<div class="col-lg-4 about-in text-left">


<div class="card">
<div class="card-body">
<i class="fas fa-truck mb-2"></i>

<h5 class="card-title">Land Transport</h5>


<!-- <p class="card-text">Lorem ipsum dolor sit
amet consectetur elit,Adipisicing elit tempor.</p> -->
</div>
</div>
</div>
<div class="col-lg-4 about-in text-left">
<div class="card">
<div class="card-body">
<i class="fab fa-docker mb-2"></i>

<h5 class="card-title">Supply</h5>
<!-- <p class="card-text">Lorem ipsum dolor sit
amet consectetur elit,Adipisicing elit tempor.</p> -->
</div>
</div>

</div>
<div class="col-lg-4 about-in text-left">
<div class="card">
<div class="card-body">
<i class="far fa-clock mb-2"></i>

<h5 class="card-title">Fast & On Time</h5>


<!-- <p class="card-text">Lorem ipsum dolor sit
amet consectetur elit,Adipisicing elit tempor.</p> -->
</div>
</div>

</div>

<div class="col-lg-4 about-in text-left">


<div class="card">
<div class="card-body">
<i class="far fa-money-bill-alt mb-2"></i>

<h5 class="card-title">Weather Insuarance</h5>


<!-- <p class="card-text">Lorem ipsum dolor sit
amet consectetur elit,Adipisicing elit tempor.</p> -->
</div>
</div>
</div>

</div>

</div>
</div>
</section>
<!-- //ab -->
<!---728x90--->
<!-- banner-bottom-w3ls -->
<section class="banner-bottom-w3ls py-lg-5 py-md-5 py-3">
<div class="container-fluid">
<div class="row">
<div class="col-lg-6 about-img">
</div>
<div class="col-lg-6 about-right">
<h4>Who We Are</h4>
<h3>We give you complete control of your shipments.</h3>
<p class="my-4">Over the years we have served our customers
with the best shipping experince with the help
of technological tools ranging from iot, live tracking,etc.
</p>

<ul class="author d-flex">


<li><img class="img-fluid" src="images/author.jpg"
alt=""></li>
<li><span>Johnson Smith</span>Sales
Representative,Atlanta,USA.</li>
</ul>

</div>
</div>
</div>
</section>
<!-- //banner-bottom-w3ls -->
<!-- /services -->
<section class="banner-bottom-w3ls py-lg-5 py-md-5 py-3">
<div class="container">
<!---728x90--->

<div class="inner-sec-w3layouts py-lg-5 py-3">


<h3 class="tittle text-center mb-md-5 mb-4">We Offered
Services</h3>
<div class="row middle-grids">
<div class="col-lg-4 about-in middle-grid-info text-center">
<div class="card">
<div class="card-body">
<i class="fas fa-archive mb-2"></i>
<h5 class="card-title my-3">Storage</h5>
<!-- <p class="card-text">We provide storage
facilities for shippers which is safer and cheaper than others.
</p> -->
</div>
</div>
</div>
<div class="col-lg-4 about-in middle-grid-info text-center">
<div class="card">
<div class="card-body">
<i class="fas fa-signal mb-2"></i>
<h5 class="card-title my-3">Trucking Services</h5>
<p class="card-text">
</p>
</div>
</div>
</div>
<div class="col-lg-4 about-in middle-grid-info text-center">
<div class="card">
<div class="card-body">
<i class="fas fa-users mb-2"></i>
<h5 class="card-title my-3">Expert Staff</h5>
<!-- <p class="card-text">At Fedex, our customers
are our pride this is why hiring experts to do the job is key to us.
</p> -->
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- //services -->
<!--gallery -->
<section class="gallery py-md-5 py-3">
<div class="gallery-inner pb-md-5 pb-3">
<h3 class="tittle text-center mb-md-5 mb-4">Gallery</h3>
<ul class="portfolio-categ filter pb-5 mb-lg-3 text-center">
<li class="port-filter all active">
<a href="#">All</a>
</li>
<li class="cat-item-1">
<a href="#" title="Category 1">category 1</a>
</li>
<li class="cat-item-2">
<a href="#" title="Category 2">category 2</a>
</li>
<li class="cat-item-3">
<a href="#" title="Category 3">category 3</a>
</li>

</ul>
<ul class="portfolio-area clearfix">
<li class="portfolio-item2" data-id="id-0" data-type="cat-item-3">
<span class="image-block img-hover">
<a class="image-zoom" href="images/g1.jpg" data-
gal="prettyPhoto[gallery]">
<img src="images/g1.jpg" class="img-fluid " alt="">
</a>
</span>
</li>
<li class="portfolio-item2" data-id="id-1" data-type="cat-item-2">
<span class="image-block">
<a class="image-zoom" href="images/g2.jpg" data-
gal="prettyPhoto[gallery]">
<img src="images/g2.jpg" class="img-fluid " alt="">
</a>
</span>
</li>
<li class="portfolio-item2" data-id="id-2" data-type="cat-item-1">
<span class="image-block">
<a class="image-zoom" href="images/g3.jpg" data-
gal="prettyPhoto[gallery]">
<img src="images/g3.jpg" class="img-fluid " alt="">
</a>
</span>
</li>
<li class="portfolio-item2" data-id="id-4" data-type="cat-item-3">
<span class="image-block">
<a class="image-zoom" href="images/g4.jpg" data-
gal="prettyPhoto[gallery]">
<img src="images/g4.jpg" class="img-fluid " alt="">
</a>
</span>
</li>
<li class="portfolio-item2" data-id="id-5" data-type="cat-item-2">
<span class="image-block">
<a class="image-zoom" href="images/g5.jpg" data-
gal="prettyPhoto[gallery]">
<img src="images/g5.jpg" class="img-fluid " alt="">
</a>
</span>
</li>
<li class="portfolio-item2" data-id="id-7" data-type="cat-item-1">
<span class="image-block">
<a class="image-zoom" href="images/g6.jpg" data-
gal="prettyPhoto[gallery]">
<img src="images/g6.jpg" class="img-fluid " alt="">
</a>
</span>
</li>
<li class="portfolio-item2" data-id="id-7" data-type="cat-item-1">
<span class="image-block">
<a class="image-zoom" href="images/g7.jpg" data-
gal="prettyPhoto[gallery]">
<img src="images/g7.jpg" class="img-fluid " alt="">
</a>
</span>
</li>
<li class="portfolio-item2" data-id="id-7" data-type="cat-item-1">
<span class="image-block">
<a class="image-zoom" href="images/g8.jpg" data-
gal="prettyPhoto[gallery]">
<img src="images/g8.jpg" class="img-fluid " alt="">
</a>
</span>
</li>
</ul>
<!--end portfolio-area -->
</div>
<!-- //gallery container -->
</section>
<!-- //gallery -->
<!-- /bottom-last -->
<section class="bottom-last py-5 text-center">
<div class="bottom-bg">
<h3>Imagination… What we can easily see is only a small percentage of
what is possible.</h3>

</div>
</section>
<!-- //bottom-last -->
<!--/Blog-Posts-->
<section class="banner-bottom-w3ls bg-light py-md-5 py-4">
<div class="container">
<div class="inner-sec-w3layouts py-md-5 py-4">
<h3 class="tittle text-center mb-md-5 mb-4">
Blog Posts</h3>
<!--/services-grids-->
<div class="row blog-sec">
<div class="col-lg-4 about-in blog-grid-info text-left">
<div class="card img">
<div class="card-body img">
<img
src="https://about.van.fedex.com/wp-content/uploads/2019/06/FedEx-Dollar-General-
600x400.jpg" alt="" class="img-fluid">
<div class="blog-des">
<span class="entry-date">June 17, 2019</span>
<h5 class="card-title text-uppercase mt-2"><a
href="blog/dollar-general.html">

FedEx Agreement with Dollar General


Increases Convenient Access to FedEx Drop-off and Pickup Services
</a></h5>
</p>
</div>
</div>
</div>
</div>
<div class="col-lg-4 about-in blog-grid-info text-left">
<div class="card img">
<div class="card-body img">
<img
src="https://about.van.fedex.com/wp-content/uploads/2019/05/Ground-Seven-Day-
600x400.jpg" alt="" class="img-fluid">
<div class="blog-des">
<span class="entry-date">June 20, 2018</span>
<h5 class="card-title text-uppercase mt-2"><a
href="blog/ground-residential-delivery.html">Delivering Every Day: Announcing FedEx
Ground Seven-Day Residential </a></h5>

</div>
</div>
</div>
</div>
<div class="col-lg-4 about-in blog-grid-info text-left">
<div class="card img">
<div class="card-body img">
<img
src="https://about.van.fedex.com/wp-content/uploads/2018/02/Logo-Corporate-
600x400.jpg" alt="" class="img-fluid">
<div class="blog-des">
<span class="entry-date">May 30, 2019</span>
<h5 class="card-title text-uppercase mt-2"><a
href="blog/fedex-ground-announces-seven-day-residential-delivery-year-round.html">
FedEx Ground Announces Seven-Day
Residential Delivery Year-round
</a></h5>

</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!--//Blog-Posts-->
<!--/testimonials-->
<section class="clients py-md-5 py-3">
<div class="container">
<div class="inner-sec-w3layouts py-md-5 py-3">
<h3 class="tittle text-center mb-md-5 mb-4">Some word from our
Clients</h3>
<div class="owl-carousel owl-theme">
<div class="item">
<div class="feedback-info text-left">
<div class="feedback-top">

<p>It's been an amazing experience shipping with


Fedex for i and my company, over 7 years of trusted and quality services.</p>
</div>
<div class="feedback-grids">
<div class="feedback-img">
<img src="images/t1.jpg" class="img-fluid
rounded-circle" alt="" />
</div>
<div class="feedback-img-info">
<h5>Morgan Dorth</h5>
<p>United States
</p>
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
<div class="item">
<div class="feedback-info text-left">

<div class="feedback-top">

<p>I would always recommend using their services,my


goods are handled with great care and arrive as stated.</p>
</div>
<div class="feedback-grids">
<div class="feedback-img">
<img src="images/t3.jpg" class="img-fluid
rounded-circle" alt="" />
</div>
<div class="feedback-img-info">
<h5>Steven Wilson</h5>
<p>United States
</p>
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
<div class="item">
<div class="feedback-info text-left">
<div class="feedback-top">
<p>I love the customer serivice and ease of
shipping my products around the world</p>
</div>
<div class="feedback-grids">
<div class="feedback-img">
<img src="images/t2.jpg" class="img-fluid
rounded-circle" alt="" />
</div>
<div class="feedback-img-info">
<h5>Peter guptill</h5>
<p>Vestibulum </p>
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
<div class="item">
<div class="feedback-info text-left">

<div class="feedback-top">

<p>They saved me a lot of cash on transporting my


products to my customers arounf the world</p>
</div>
<div class="feedback-grids">
<div class="feedback-img">
<img src="images/t3.jpg" class="img-fluid
rounded-circle" alt="" />
</div>
<div class="feedback-img-info">
<h5>Steven Wilson</h5>
<p>United States
</p>
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!--//testimonials-->

<!--/newsletter-->
<footer class="newsletter_right_w3agile bg-dark pymd-5 py-4">
<div class="container">
<div class="inner-sec-w3layouts py-md-5 py-3">
<h3 class="tittle text-center mb-md-5 mb-4 text-white">Subscribe
our Newsletter</h3>
<div class="n-right-w3ls">
<form>
<div id="form_message" style="color: #fff">

</div>
<div class="form-group">
<input class="form-control" id="sub_first_name"
type="text" name="Name" placeholder="Name" required="">
</div>
<div class="form-group">
<input class="form-control" id="sub_first_email"
type="email" name="Email" placeholder=" Email Address" required="">
</div>

<div class="form-group">
<input class="form-control submit text-uppercase"
id="subscribe_btn" type="button" value="Subscribe">
</div>
<div class="clearfix"></div>
</form>
</div>
<div class="row footer-bottom-wthree mt-lg-5 mt-3">
<div class="col-lg-6 copyright">
<h2><a class="navbar-brand" href="index.html">
<img src="images/logo.png" height="50"></a>

</a></h2>
<p class="copy-right mt-3">© Fedex 1995-2019. All Rights
Reserved </p>
</div>
<div class="col-lg-6 social-icon footer">
<ul class="links-nav d-flex justify-content-end">
<li>
<a class="active" href="index.html">Home</a>
</li>
<li>
<a href="about.html">About</a>
</li>

<li>
<a href="contact.html">Contact</a>
</li>
</ul>
<ul class="social-icons d-flex justify-content-end mt-3">
<li class="mr-1"><a href="#"><span class="fab fa-
facebook-f"></span></a></li>
<li class="mx-1"><a href="#"><span class="fab fa-
twitter"></span></a></li>
<li class="mx-1"><a href="#"><span class="fab fa-
google-plus-g"></span></a></li>
<li class="mx-1"><a href="#"><span class="fab fa-
linkedin-in"></span></a></li>
</ul>
</div>
<div class="clearfix"></div>

</div>

</div>
</div>
</footer>
<!--//newsletter-->
<!--model-forms-->
<!--/Login-->
<div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header text-center">
<button type="button" class="close" data-dismiss="modal" aria-
label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body" id="modal_details">

<div class="login px-4 mx-auto mw-100">


<h5 class="text-center mb-4">TRACK</h5>
<form>

<div id="error_messages" style="color:red">

</div>

<div class="form-group">
<label class="mb-2">TRACKING ID</label>
<input type="text" class="form-control"
id="tracking_id" aria-describedby="emailHelp" placeholder="9876789022" required="">
<small id="emailHelp" class="form-text text-
muted">Key in your tracking id to know the state of your parcel</small>
</div>
<button id="trck_btn" class="btn btn-success submit mb-
4">TRACK</button>

</form>

<div id="success_messages" style="color:#4eaf78">

</div>

<div id="details_messages" style="font-size:10px;">


</div>
</div>
</div>

</div>
</div>
</div>
<!--//Login-->
<!--//model-form-->
<!-- js -->
<script src="js/jquery-2.2.3.min.js"></script>
<script src="js/minimal-slider.js"></script>
<!-- carousel -->

<script src="js/owl.carousel.js"></script>

<script>
const btn2 = document.getElementById('subscribe_btn');
btn2.addEventListener('click',function(e){
// e.preventDefault()
if(sub_first_name.value == '' || sub_email.value == ''){
document.getElementById('form_message').innerHTML = 'Details are
incomplete!'

}
document.getElementById('form_message').innerHTML = 'Subscription
was successful!'
})
</script>
<script>
let btn = document.getElementById('trck_btn')
btn.addEventListener('click',iniTrack)

let messageContainer = document.getElementById('error_messages')


let successContainer = document.getElementById('success_messages')
let detailsContainer = document.getElementById('details_messages')

function iniTrack(e){
e.preventDefault()
messageContainer.innerHTML = ''
successContainer.innerHTML = ''
btn.innerHTML = 'Searching...'
btn.disabled = true

data = {
tracking_id:tracking_id.value
}

console.log(data)
if(data.tracking_id.length <= 0){
messageContainer.innerHTML = 'Tracking ID was left emptyy'
btn.innerHTML = 'TRACK'
btn.disabled = false
return false
}

const url = '/api/courier/track.php';


var myHeaders = new Headers()
myHeaders.append('Content-Type','Application/json')

const signupRequest = new Request(url,{


method:'POST',
cache:'default',
headers:myHeaders,
body:JSON.stringify(data),
mode:'cors'

})

$.ajax({
url,
method:'POST',
data
}).done(res =>
{
// console.log(res.message)

if(res.status === 'failed'){


btn.innerHTML = 'TRACK'
btn.disabled = false
messageContainer.innerHTML = res.message

}else if(res.status_code == 200){


btn.innerHTML = 'Waiting...'
successContainer.innerHTML = 'Please verify details below'
for (const key in res.data[0]) {
if (res.data[0].hasOwnProperty(key)) {
const element = res.data[0][key];

for (const k in element) {


if (element.hasOwnProperty(k)) {
const elem = element[k];
if(k == 'receiver_first_name'){
detailsContainer.innerHTML += `<div>Recievers First Name - $
{elem}</div>`
}
if(k == 'receiver_last_name'){
detailsContainer.innerHTML += `<div>Recievers Last Name - $
{elem}</div>`
}
if(k == 'shipper_last_name'){
detailsContainer.innerHTML += `<div>Senders Last Name -
${elem}</div>`
}
if(k == 'shipper_first_name'){
detailsContainer.innerHTML += `<div>Senders First Name -
${elem}</div>`
}
}
}

detailsContainer.innerHTML += `
<button id="trck_btn_veify" class="btn btn-success btn-
sm submit mb-4">Verify</button>
<button id="trck_btn_cancel" class="btn btn-danger btn-
sm submit mb-4">Reject</button>

`
}
}
}

console.log(res)
document.getElementById('trck_btn_veify').addEventListener('click',function(){
detailsContainer.innerHTML = ''
successContainer.innerHTML = 'Redirecting you to details page..'
btn.innerHTML = 'Confirmed!'
setTimeout(() => {
window.location.replace(`track.php?tracking_id=${tracking_id.value}`)

}, 2000);

})
document.getElementById('trck_btn_cancel').addEventListener('click',function(){
detailsContainer.innerHTML = ''
successContainer.innerHTML = ''
btn.innerHTML = 'TRACK'
btn.disabled = false
tracking_id.value = ''

})
}
).fail(err =>
{
console.log(err)
if(err.responseText == "Connection error: SQLSTATE[HY000] [2002] No connection
could be made because the target machine actively refused it."){
messageContainer.innerHTML = 'Whooops! Something went wrong,contact admin'
btn.innerHTML = 'TRACK'
btn.disabled = false
}else if(err.responseJSON.message == 'No tracking id found.'){
btn.innerHTML = 'TRACK'
btn.disabled = false
messageContainer.innerHTML = err.responseJSON.message
}
btn.innerHTML = 'TRACK'
btn.disabled = false

// submit_button.innerHTML= 'Try again.'


// if(err.responseText == ''){
// messageContainer.innerHTML = 'Are you registered yet?'

// }
})

</script>

<script>
$(document).ready(function() {
$('.owl-carousel').owlCarousel({
loop: true,
margin: 10,
responsiveClass: true,
responsive: {
0: {
items: 1,
nav: true
},
600: {
items: 1,
nav: false
},
900: {
items: 1,
nav: false
},
1000: {
items: 3,
nav: true,
loop: false,
margin: 20
}
}
})
})
</script>
<!-- //carousel -->
<script>
$(document).ready(function() {
$(".dropdown").hover(
function() {
$('.dropdown-menu', this).stop(true, true).slideDown("fast");
$(this).toggleClass('open');
},
function() {
$('.dropdown-menu', this).stop(true, true).slideUp("fast");
$(this).toggleClass('open');
}
);
});
</script>
<!-- //dropdown nav -->
<!--/ start-smoth-scrolling -->
<script src="js/move-top.js"></script>
<script src="js/easing.js"></script>
<script>
jQuery(document).ready(function($) {
$(".scroll").click(function(event) {
event.preventDefault();
$('html,body').animate({
scrollTop: $(this.hash).offset().top
}, 900);
});
});
</script>
<script>
$(document).ready(function() {
/*
var defaults = {
containerID: 'toTop', //
fading element id
containerHoverID:
'toTopHover', // fading element hover id
scrollSpeed: 1200,
easingType: 'linear'
};
*/

$().UItoTop({
easingType: 'easeOutQuart'
});

});
</script>
<!--// end-smoth-scrolling -->
<!-- /js -->
<script src="js/bootstrap.js"></script>
<!-- //js -->
<!-- jQuery-Photo-filter-lightbox-Gallery-plugin -->
<!--// end-smoth-scrolling -->
<script src="js/jquery-1.7.2.js"></script>
<script src="js/jquery.quicksand.js"></script>
<script src="js/pretty-script.js"></script>
<script src="js/jquery.prettyPhoto.js"></script>
<!-- //jQuery-Photo-filter-lightbox-Gallery-plugin -->

</body>
</html>

You might also like