ALL MOBILE DRIVERS: Website

<div dir="ltr" style="text-align: left;" trbidi="on"><div style="text-align: justify;">If you want to create <b>Responsive Google Map</b>, then you have two options, first with <b>CSS</b> and the second is <b>JavaScript</b>.  Today, a lot of designers and developers are struggling to Embed Google maps in responsive designs.</div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi337pKsobdCrWNe-vj8PLow3M28zS-31uBZCrCCTNxmObTnCp8QJosmQeWml86Gcx-nBPW_A863GeyrSU19uuZLR_eCmUOubKjh2ZS-MV4Lr9GMCyWdDzd96yaP2ZkFXvxPYuNSyxI0DKa/s1600/Responsive+Google+Map.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi337pKsobdCrWNe-vj8PLow3M28zS-31uBZCrCCTNxmObTnCp8QJosmQeWml86Gcx-nBPW_A863GeyrSU19uuZLR_eCmUOubKjh2ZS-MV4Lr9GMCyWdDzd96yaP2ZkFXvxPYuNSyxI0DKa/s1600/Responsive+Google+Map.jpeg" width="181" /></a></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><b>First basic steps with CSS for creating a responsive Google Map.</b></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><b>Responsive Google Map CSS</b></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">.googlemap-container {</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">    position: relative;</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">    padding-bottom: 26.25%;</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">    padding-top: 30px;</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">    height: 0;</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">    overflow: hidden;</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">}</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;"></span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">.googlemap-container iframe, </span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">.googlemap-container object, </span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">.googlemap-container embed {</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">    position: absolute;</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">    top: 0;</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">    left: 0;</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">    width: 100%;</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">    height: 100%;</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">}</span></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><b>Responsive Google Map HTML Markup</b></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><span style="background-color: #eeeeee;"><div class="googlemap-container "></span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;"><iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.ch/maps?f=q&amp;source=s_q&amp;hl=de&amp;geocode=+&amp;q=jaipur+Rajasthan&amp;ie=UTF8&amp;hq=&amp;hnear=Jaipur,+Rajasthan,+Indien&amp;ll=26.912416,75.787288&amp;spn=0.375941,0.441513&amp;t=m&amp;z=11&amp;output=embed"></iframe></span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;"></div></span></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><b>Responsive Google Map with JavaScript</b></div><div style="text-align: justify;">Use the following Javascript code before end the head tag into your website html file.</div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><span style="background-color: #eeeeee;"><script type="text/javascript"></span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">function initialize() {</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">   var mapOptions = {</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">           zoom: 9,</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">           center: new google.maps.LatLng(28.9285745, 77.09149350000007), </span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">           mapTypeId: google.maps.MapTypeId.TERRAIN</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">       };</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;"></span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">   var map = new google.maps.Map(document.getElementById('responsive-google-map'),</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">                                   mapOptions);</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">                             </span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">   var marker = new google.maps.Marker({</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">                   map: map,</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">                   draggable: false,</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">                   position: new google.maps.LatLng(28.9285745, 77.09149350000007)</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">       });</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">}</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;"></span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">google.maps.event.addDomListener(window, 'resize', initialize);</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;">google.maps.event.addDomListener(window, 'load', initialize);</span></div><div style="text-align: justify;"><span style="background-color: #eeeeee;"></script></span></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><b>HTML markup</b></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><span style="background-color: #eeeeee;"><div id='responsive-google-map' style='width:100%;height:300px;'></div></span></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;">It is working fine on your phone or tablet.</div></div>

How to Create Responsive Google Map For Your Website or Blog

If you want to create Responsive Google Map , then you have two options, first with CSS and the second is JavaScript . Today, a lot of des...

<div dir="ltr" style="text-align: left;" trbidi="on"><div style="text-align: justify;">Google Drive has always been a great place to sharing your documents on web and they are 100% secure and available around the world. November 28, 2012, Eric Gilmore is announced a new Google Drive feature, “site publishing.” In this features you can upload your HTML, Javascript, CSS and Images into a public folder and share it as "Public on the web."</div><div style="text-align: justify;"><br /></div><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMYtQrgEESZX52K6bGFh1tty_2tiChSemqc6BH1Af_zdrVj6gqI30XzEX8u6cwlDrvB10EGdOyJbWKtExdj6DLUzeW73f4vwSbePIoS6zQ_0PQaOs_nlIIpiQBsWdf54mFIvVzQvbNI1XR/s1600/Google_drive_logo.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMYtQrgEESZX52K6bGFh1tty_2tiChSemqc6BH1Af_zdrVj6gqI30XzEX8u6cwlDrvB10EGdOyJbWKtExdj6DLUzeW73f4vwSbePIoS6zQ_0PQaOs_nlIIpiQBsWdf54mFIvVzQvbNI1XR/s1600/Google_drive_logo.png" /></a></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"><br /></div><div style="text-align: justify;">Many peoples are looking for a free web hosting, there are lot of companies who provides free web hosting with unlimited space. But it is hard to choose the right web hosting company with 100% security. Google Drive is the solution for you.</div><div style="text-align: justify;"><br /></div><div style="text-align: justify;">Step by step guide for how to use Google Drive as a web host:- </div><div style="text-align: justify;"><br /></div><div style="text-align: justify;"></div><ol><li>Create a new folder in Google Drive and share it as "Public on the web."</li><li>Upload your HTML, CSS, and Javascript files to this folder.</li><li>Open the HTML file, and click the "Preview" button in the toolbar Section.</li><li>Share the URL that looks like "www.googledrive.com/host/..." from the preview and everyone on the web can access your new website using that address. </li></ol><br /><div style="text-align: justify;">Google drive does not support server-side scripts languages like PHP, Asp.net, Python and Java.</div><div style="text-align: justify;"><br /></div><br /></div>

How to Host My Website or Web Page Free on Google Drive

Google Drive has always been a great place to sharing your documents on web and they are 100% secure and available around the world. Novembe...