Created
May 22, 2016 14:46
-
-
Save janeygcode/61e53a7a09ac07a4b28f1cda843c1a93 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>GigAware</title> | |
<meta name="viewport" content="initial-scale=1.0"> | |
<meta charset="utf-8"> | |
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> | |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> | |
<style> | |
html, body { | |
background: url(phone.jpg) no-repeat center center fixed; | |
-webkit-background-size: cover; | |
-moz-background-size: cover; | |
-o-background-size: cover; | |
background-size: cover; | |
} | |
#map { | |
height: 100%; | |
} | |
</style> | |
</head> | |
<body> | |
<!-- Google maps API --> | |
<div id="map"></div> | |
<script> | |
var map; | |
function initMap() { | |
map = new google.maps.Map(document.getElementById('map'), { | |
center: {lat: 33.54, lng: 35.32}, | |
zoom: 8 | |
}); | |
} | |
</script> | |
<!-- End Google Maps API --> | |
<div class="container-fluid"> | |
<div class="row"> | |
<!-- Native browser geolocation finder --> | |
<label for="cLocation">Use Your Current Location?</label> | |
<input type="checkbox" id="useLocation" name="cLocation">Yes | |
</div> | |
<div class="row" style="background-color: rgba(122, 130, 136, 0.4);"> | |
<!-- find work (left) column --> | |
<div class="col-lg-6 col-md-6"> | |
<div class="text-center"> | |
<h2>I am looking to hire</h2> | |
<button type="button" class="btn btn-success"> | |
Register to hire | |
</button> | |
<h5> | |
Post a gig and find the perfect person to get the job done. | |
</h5> | |
</div> | |
</div> | |
<!-- get hired (right) column --> | |
<div class="col-lg-6 col-md-6"> | |
<div class="text-center"> | |
<h2>I want to get hired!</h2> | |
<button type="button" class="btn btn-success">Register for Work</button> | |
<h5>Find a gig and get paid.</h5> | |
</div> | |
</div> | |
<!-- closing div for registrations row --> | |
</div> | |
</div> | |
<script> | |
$("#useLocation").click(function(){ | |
if (navigator.geolocation) { | |
var myLat = null; | |
var myLng = null; | |
navigator.geolocation.getCurrentPosition( | |
function (position) { | |
// Assign coordinates to variables | |
myLat = position.coords.latitude; | |
myLng = position.coords.longitude; | |
console.log(myLat, myLng); | |
} | |
); | |
} | |
} | |
); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment