Google Tour Indoor ACC
Google Tour Indoor ACC.
by Abid Shaik
HTML
<iframe id="myframe" width="700px" height="700px" src="https://www.google.com/maps/embed?pb=!1m0!3m2!1sen!2sus!4v1474581219538!6m8!1m7!1sRqTXdTnNauwAAAQvvJlxVQ!2m2!1d42.02112642666395!2d-93.64787245367393!3f0!4f0!5f0.7820865974627469" onload="onMyFrameLoad()"></iframe>
<!--<div id="mask" class="masks" style="display:none">.</div>
<div id="viewonGmask" class="masks" style="display:none">Acc Austin</div>
<div id="FullMask"><img src = "http://dc394.4shared.com/img/Cl_0s9st/s3/loading.gif" /></div>-->
CSS
#mask {
position: absolute;
left: 550px;
background-color: rgb(34, 34, 34);
top: 696px;
width: 160px;
height: 14px;
}
#viewonGmask {
position: absolute;
background-color:#222222;
font-family: Roboto, Arial;
color:#fff;
opacity:0.9;
top:60px;
left:20px;
width:185px;
font-weight: bold;
font-size: 12px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis
}
#FullMask {
position: absolute;
background-color: rgb(34, 34, 34);
top: 0px;
width: 700px;
height: 700px;
}
#FullMask img {
margin: 80px 95px;
}
JavaScript
/*Google Maps Custom Inside View like Sreet View on iFrame */
$("#iFrame").ready(function () {
$(".masks").show("slow");
$("#FullMask >img").fadeOut(3000);
$("#FullMask").fadeOut("slow");
});