Google Maps... - Socoder

-=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- (c) WidthPadding Industries 1987 0\|543\|0 -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=-
Socoder -> Web Development -> Google Maps...
Thu, 28 Apr 2011, 02:41
Afr0	I'm embedding Google Maps to show the location of the company I'm working for. It is working (although I had to use a lot of time finding the right coordinates to use, because the coordinates from Google Earth were off by several miles...), but the Javascript code seems to be causing everything else to be stopping up (I can't select any of the items on my navigation menu for the site...). Should I output all the HTML with PHP instead, would that work? <html> <!-- Created on: 13.04.2011 --> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Grafisk Partner</title> <meta name="description" content=""> <meta name="keywords" content="grafisk partner trykk boligmagasinet agder"> <meta name="author" content="Mats Vederhus"> <meta name="generator" content="AceHTML Freeware"> <link rel=stylesheet href="index-style.css"> <p class="CenteredImage"><img src="Grafisk Partner farge.jpg"/></p> </head> <body onload="initialize()"> <div id="map_canvas" style="width:300px; height:300px;"></div> <div class="Header"> <br/> <p class="CenteredHeaderText"><b>Velkommen til hjemmesia vår!</b></p> </div> <div class="Container"> <div class="Menu"> <ul> <li><a href="index.html">Hjem</a></li> <li><a href="links.html">Linker</a></li> </ul> </div> <div class="Content"> <br/> <p class="CenteredText">Grafisk Partner er et firma i Kristiansand.<br/> Vi designer og trykker alt.<br/><br/> <b>Adresse:</b><br/> H. Wergelands gt. 50B<br/> Kristiansand S<br/> Telefon: 38021912<br/> <a href="mailto:post@gpartner.no">E-Brev</a></p> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0px; padding: 0px } #map_canvas { height: 100% } </style> <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=true"></script> <script type="text/javascript"> function initialize() { var latlng = new google.maps.LatLng(58.148004, 7.993500); var myOptions = { zoom: 17, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); } </script> </div> </div> </body> </html> --v -=-=- Afr0 Games Project Dollhouse on Github - Please fork!
Thu, 28 Apr 2011, 03:20
JL235	Works for me (in FireFox 4 and Chrome 10). Btw your missing a doctype.
Thu, 28 Apr 2011, 03:36
Afr0	Strange, doesn't work for me. Did you include the doctype? It doesn't even work when I copied and pasted embed code from Google! o_O -=-=- Afr0 Games Project Dollhouse on Github - Please fork!
Thu, 28 Apr 2011, 04:41
JL235	No I didn't add a doctype, but this might fix it for you. What browser are you testing this in? For example IE blocks scripts when run in local files for security reasons.
Mon, 02 May 2011, 03:53
Afr0	After a lot of fiddling, I've managed to figure out that the problem wasn't Google's fault. It turns out that if I comment out the 'float:left;' line from 'div.Menu', the links in the menu work. Otherwise they don't. <html> <!-- Created on: 13.04.2011 --> <?php echo(" <head> <meta http-equiv=\"Content-Type\" content=\"text/html; charset=windows-1252\"> <title>Grafisk Partner</title> <meta name=\"description\" content=\"\"> <meta name=\"keywords\" content=\"grafisk partner trykk boligmagasinet agder\"> <meta name=\"author\" content=\"Mats Vederhus\"> <meta name=\"generator\" content=\"AceHTML Freeware\"> <link rel=stylesheet href=\"index-style.css\"> <p class=\"CenteredImage\"><img src=\"Grafisk Partner farge.jpg\"/></p> </head> <body> <div class=\"Header\"> <br/> <p class=\"CenteredHeaderText\"><b>Velkommen til hjemmesia vår!</b></p> </div> <div class=\"Container\"> <div class=\"Menu\"> <ul> <li><a href=\"index.html\">Hjem</a></li> <li><a href=\"links.html\">Linker</a></li> </ul> </div> <div class=\"Content\"> <br/> <p class=\"CenteredText\">Grafisk Partner er et firma i Kristiansand.<br/> Vi designer og trykker alt.<br/><br/> <b>Adresse:</b><br/> H. Wergelands gt. 50B, Kristiansand S<br/> Telefon: 38021912<br/> <a href=\"mailto:post@gpartner.no\">E-Brev<br/></a></p> <br/><br/>"); /<p class=\"CenteredText\"> <iframe width=\"425\" height=\"350\" frameborder=\"0\" scrolling=\"no\" marginheight=\"0\" marginwidth=\"0\" src=\"https://maps.google.com/maps?f=q&source=s_q&hl=no&geocode=&q=Henrik+Wergelandsgate+50B,+Norge&aq=0&sll=37.0625,-95.677068&sspn=68.810068,135.263672&ie=UTF8&hq=&hnear=Henrik+Wergelands+gate+50B,+4612+Kristiansand,+Vest-Agder,+Norge&t=h&z=14&iwloc=A&ll=58.148204,7.993929&output=embed\"></iframe> </p>/ echo("</div> </div> </body>"); ?> </html> --v @charset "utf-8"; .CenteredImage { text-align:center; margin-top:0px; margin-bottom:0px; padding:0px; } .CenteredHeaderText { text-align:center; margin-top:0px; margin-bottom:0px; padding:0px; font:20px arial; color:white; } .CenteredText { text-align:center; margin-top:0px; margin-bottom:0px; padding:0px; font:15px arial; color: #251e7b; } /Content and menu are contained within Container./ div.Container { margin: 0 auto; position: relative; clear: both; width: 600px; } div.Content { position: relative; /margin-left:auto; margin-right:auto;/ float: center; } div.Menu { /position: relative;/ float: left; /THIS STOPS LINKS FROM WORKING!!/ } div.Menu li { font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif; margin: 0; padding: 0; } div.Menu a { background: #333; border-bottom: 1px solid #393939; color: #ccc; display: block; margin: 0; padding: 8px 12px; text-decoration: none; } div.Menu a:hover { background: #2580a2 url("images/hover.gif") left center no-repeat; color: #fff; padding-bottom: 8px; } div.Menu ul { background: #333; list-style: none; /margin-left: 650px;/ /margin-left: auto; margin-right: auto;/ padding: 0; width: 50px; } div.Header { background-color:#251e7b; width: 600px; margin-left:auto; margin-right:auto; } --v Help, please? :\| -=-=- Afr0 Games Project Dollhouse on Github - Please fork!
Mon, 02 May 2011, 03:57
spinal	afr0 After alot of fiddling, "alot" isn't a real word... -=-=- Check out my excellent homepage!
Mon, 02 May 2011, 04:01
Afr0	When I have no 'float:left;' it looks like: Otherwise it looks like: -=-=- Afr0 Games Project Dollhouse on Github - Please fork!
Mon, 02 May 2011, 04:05
Afr0	spinal: Fixed!!