"Google map - contact us"
Bootstrap 3.3.0 Snippet by skyrites

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
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<section class="map-holder">
<div class="properties-map" style="position: relative;">
<div id="mapdiv" style="position: relative;"><div class="addressholder">
<div class="addressheader"><img src="http://skyrites.com/gitimg/logo.png" width="232" height="82" alt="logo"></div>
<ul>
<li>
<i><img src="http://skyrites.com/gitimg/pin-map.png" width="34" height="34" alt="pinmap"></i>
<span class="ctnaddr">29829 Santa Margarita Parkway<br/> Suite 100 <br/>Rancho Santa Margarita, CA 92688</span>
</li>
<li>
<i><img src="http://skyrites.com/gitimg/pin-call.png" width="34" height="34" alt="pincall"></i>
<span class="ctnaddr">888.WEB.HITZ <br/>
Toll Free (888.932.4489) <br/>
Phone 949.713.1410 <br/>
Fax 949.454.2857 </span>
</li>
<li>
<i><img src="http://skyrites.com/gitimg/pin-mail.png" width="34" height="34" alt="pinmail"></i>
<span class="ctnaddr"><a href="#">info@etargeting.com</a></span>
</li>
</ul>
</div>
<div lat="33.6381524" long="-117.6100732" id="map" style="height:768px;"></div>
</div>
</div>
</section>
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
/*-------*/
.title-head{
text-align:center;
margin-bottom:15px;
}
.title-head p{
font-weight:300;
font-size:20px;color:#515151;
line-height:25px;
}
.title-head h1{
font-size:148px;
color:#515151;
font-weight:900;
line-height:150px;
margin:0 0 15px;
}
.map-holder{
position:relative;
}
.addressholder{
width:360px;
background:#fff;
position:absolute;
left:50%;
margin-left:-180px;
top:12%;
z-index:9999;
}
.addressholder .addressheader{
text-align:center;
padding:15px;
background:#515151;
}
.addressholder ul{
font-style:normal;
list-style:none;
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
//<script src="https://maps.googleapis.com/maps/api/js?v=3.13&libraries=places"></script>
<script type="text/javascript">
(function() {
var s = document.createElement('script');
s.type = 'text/javascript';
s.async = true;
s.src = 'https://maps.googleapis.com/maps/api/js?v=3.13&libraries=places';
var x = document.getElementsByTagName('script')[0];
x.parentNode.insertBefore(s, x);
})();
</script>
<script type="text/javascript">
// When the DOM is ready, run this function
$(document).ready(function() {
//Set the carousel options
$('#quote-carousel').carousel({
pause: true,
interval: 10000,
});
});
function init() {
window.addEventListener('scroll', function(e){
var distanceY = window.pageYOffset || document.documentElement.scrollTop,
shrinkOn = 300,
header = document.querySelector("nav");
if (distanceY > shrinkOn) {
classie.add(header,"smaller");
} else {
if (classie.has(header,"smaller")) {
classie.remove(header,"smaller");
}
}
});
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: