No Description Available
Call to action button
1003 06 October 2019
Abhishek Singh
~ onex1
No Description Available
let modal = document.getElementById('myModal');
function register(){
modal.style.display = 'block';
}
function myCloseBtn(){
modal.style.display = 'none';
}
var a = document.getElementById('sideNav');
function myNav(){
a.style.display = 'block';
}
function backArrow(){
a.style.display = 'none';
}
<div id="bg"></div>
<header id="header">
<div class="row">
<div onclick="myNav()" class="icon">
<i class="fas fa-bars"></i>
</div>
<div class="brandin">
<h1>Pixon</h1>
</div>
</div>
</header>
<div id="myModal" class="modal">
<div class="modal-content">
<div class="closebtn">
<span onclick="myCloseBtn()" id="closebtn" href="#">×</span>
</div>
<label for="">Name</label>
<input type="text" id="id1">
<label for="">Email</label>
<input type="text" id="id2">
<label for="">Password</label>
<input type="password" id="id3">
<input class="check" type="checkbox"><p>Are you agree with our Terms & Conditions ?</p>
<input type="submit" class="btn" value="Submit" onclick="myfunction()">
</div>
</div>
<section id="Box">
<div class="heading">
<h1>Your schedule Appointment</h1>
<p class="para1">Get instant help from your daily life stuff.</p>
<div id="red">
<button class="btn btn-register" onclick="register()">Register and get Help</button>
</div>
</div>
<div class="content">
<div class="box">
<ul>
<li><span></span><strong>How may I help you,Bro ?</strong></li>
<li><span></span><strong>I don't know I can helped</strong></li>
<li><span></span><strong>That's deep. Let me help.</strong></li>
</ul>
</div>
</div>
</section>
<div class="sidenav" id="sideNav">
<div onclick="backArrow()" class="close">
<span><i class="fas fa-arrow-left"></i></span>
</div>
<div class="sidenav-content">
<div class="img">
<div class="profil">
<img src="demos/images/9big.jpg" alt="">
<label for="">Sia Williums</label>
<span>Developer</span>
</div>
</div>
<div class="social">
<ul>
<li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
<li><a href="#"><i class="fab fa-pinterest"></i></a></li>
<li><a href="#"><i class="fab fa-google-plus"></i></a></li>
<li><a href="#"><i class="fab fa-twitter"></i></a></li>
</ul>
</div>
<div class="menu">
<ul>
<li><a href="#"></a><span class="icon-2"><i class="fas fa-tachometer-alt"></i></span>Dashbord<span class="icon3"><i class="fas fa-angle-left"></i></span></li>
<li><a href="#"><span class="icon-2"><i class="fas fa-chart-line"></i></span>Statistics<span class="icon3"><i class="fas fa-angle-left"></i></span></a></li>
<li><a href="#"><span class="icon-2"><i class="fas fa-bell"></i></span>Notification<span class="icon3"><i class="fas fa-angle-left"></i></span></a></li>
<li><a href="#"><span class="icon-2"><i class="fas fa-dollar-sign"></i></span>Revenues<span class="icon3"><i class="fas fa-angle-left"></i></span></a></li>
<li><a href="#"><span class="icon-2"><i class="far fa-money-bill-alt"></i></span>Payments<span class="icon3"><i class="fas fa-angle-left"></i></span></a></li>
</ul>
</div>
</div>
</div>