|
HTML - Maps Api
to get the google maps api key normally one has to login to their gmail account and enter a website address and the generated key is used in a website
my question is if i have to work with many clients can i still use my own gmail login and create an api key for different clients and use the generated api key for indivdual clients websites or do the clients need to have their own gmail account can i use my 1 personal gmail account and keep creating separate api keys for different websites by specifying the individual client website address while in the google maps api page please advice. Similar TutorialsI am trying to work out how to create a rollover within a image map that creates the onmouseover effect in a seperate div - next the map on the page...Can anyone help me with this??? Here's what I have so far... <for the html> <div id="name"></div> <div id="box_l"> <img src="images/ludlow-main-map.gif" width="304" height="407" alt="" usemap="#map" style="border:none;" /> <map name="map" id="map"> <area shape="circle" coords="143,259,5" href="#" onmouseover="showme('MATERIAL');" onmouseout="out()" /> </map> </div> <and for the CSS> #box_l { width:310px; height:407; border:none; float:left; display:inline; margin-bottom:10px; } #name { width:600px; height:407; font-size:3.5em; font-weight:bold; font-family: "Arial Rounded MT Bold", Arial, Helvetica, sans-serif; letter-spacing:-2px; color:red; display:inline; text-align:justify; float:right; } <also, here's the javascript> <script type="text/javascript"> function showme(what) { $("#name").html(what+'<span style="color:black">.</span>'); $("#name").fadeIn('fast'); } function out() { //setTimeout("$(\"#name\").fadeOut('fast');",1000); $("#name").fadeOut('fast'); } </script> Any help is hugely appreciated. thx Hello, l saw this today about making an image map. http://www.javascriptkit.com/howto/imagemap.shtml after looking at it for a while and reading it l tried it at the end, l got my image to show up and the buttons are on the image but l can't see them, l know they are there because when l hover my mouse over parts of the image it changes. Anyone got any ideas why??? I am experimenting using image maps for links. In DW it is displaying as a map is there, but when I check my work in the browser there is no link when I hover my mouse Any suggestions on what I have done wrong below? HTML Code: <div id="header"><img src="images/header_image.jpg" usemap="map1" border="0" /></div> HTML Code: <map id="map1"> <area shape="rect" coords="10,10,280,180" href="#" alt=""> </map> Hi Folks, I wondering if anyone else is experiencing issues with simple HTML image maps displaying hot area outlines in IE8. Please note the image map does work it's just that a black outline of the hot area is displayed when the hot area is clicked. IE6 (except for png issue), Firefox, and Chrome are fine. I haven't tried IE7 yet (maybe one of you is still using it and can confirm) but try IE8 and you'll see the problem I'm talking about. Is there a simple HTML work around here that I'm missing. You can see the problem I'm experiencing here. Or have future versons of IE just decided to stop supporting image maps. With many thanks, John I am working on a web site where my goal is that the user is able to enter an address (and other information) but what I want is that address to be taken and on another page automatically converted to gps coordinates and found on a map. My problem is that I cannot find a way that this can be done automatically when they enter the submit button. If anybody has a suggestion it would be greatly appreciated. I'm just trying to embed a google map into a website I'm building, just showing where a particular building s located (based on Post Code). However, it is defaulting to showing the "speech bubble" type info on the pointer. This is the code I got off Google Maps. Code: <iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&q=cv32+7na&sll=53.800651,-4.064941&sspn=19.910905,57.084961&ie=UTF8&hq=&hnear=Leamington+Spa+CV32+7NA,+United+Kingdom&ll=52.310464,-1.501484&spn=0.020045,0.055747&z=14&output=embed"></iframe> How do I remove the bubble so only the pointer shows? I'm trying to create a image map for an assignment. They provide the coordinates and the image (I've attached the image). I'm suppose to make it link to the pages I've created called tempest.htm, commentary.htm, cast.htm. (They are all in the same folder with the html page with the image maps) This is what I have but its not working ....... <html> <head> <title>The Mian Page</title> <!-- The Main Page Author: John Smith Date: Oct. 04, 2011 --> </head> <body> <img src="tempest.jpg" alt="The Tempest By William Shakespeare"> <map id="map1" name="map1"> <area shape="rect" alt="link" coords="228,139,345,173" href="tempest.htm" /> <area shape="rect" alt="link" coords="359,139,508,173" href="commentary.htm" /> <area shape="rect" alt="link" coords="520,139,638,173)" href="cast.htm" </map> </body> </html> Hi All Can anyone achieve the following. I want to be able to have a bing map on my website, and I want a grey border with rounded edges on it as per the attached visual and HTML. I can achieve this by absolutely positioning a background over the top, but I lose the draggable features of it. due to there being a block level element over the top. I need the container to be able to resize dependant on the amount of space I specify, which will mean the container must be vertically adjustable. I have been tearing my hair out trying to get a solution to it. If anyone can help it would be very appreciated if someone can work some magic with a snippet or something, until this, I thought there wasnt much I couldnt solve in HTML! Thanks in advance John Hi all, I'm working on a schedule system that reads its data fro a mysql db via php and dynamically creates an image of the schedule. it then creates an image map of each object in the schedule, puts it all together and displays it. the problem I have been having for the last few days is that only the first hot spot is where is is meant to be, the rest are all off set by seemingly random amounts. Does anyone know what would be causing this? Hi guys My skill level is very low (beginner). This is my first webpage. I've created an image map. I would like to have the areas of the image map have tooltips - so when someone's mouse goes over each particular area, a tooltip with text comes up. I'd like the tooltip to look something like these tooltips: http://sandbox.leigeber.com/tooltip/ except I'd like these to be for my image map, and not for text as they are in the example given. Could you guys point me in the right direction/offer advice as to how I could achieve this affect? My image map worked fine until today. I just upgraded to firefox 3, but it's borken in IE also. Are image maps history? This exact code does not work for me now.. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> </head> <body> <map id="jugmap" name="jugmap" > <area shape="rect" coords="9,21,55,42" alt="home" title="home" href="?display="> <area shape="rect" coords="10,43,110,63" alt="instruments" title="instruments" href="?display=instruments&slideshow=instruments"> <area shape="rect" coords="12,66,127,86" alt="items for sale" title="items for sale" href="?display=forsale"> <area shape="rect" coords="11,89,143,113" alt="upcoming events" title="upcoming events" href="?display=events"> <area shape="rect" coords="11,113,128,131" alt="custom builds" title="custom builds" href="?display=custom_builds"> <area shape="rect" coords="10,135,110,157" alt="mailing list" title="mailing list" href="?display=mailing_list"> <area shape="rect" coords="10,159,71,178" alt="contact" title="contact" href="?display=contact"> <area shape="rect" coords="11,180,54,201" alt="links" title="links" href="?display=links"> </map> <img src="images/menu.jpg" width="170" border="0" usemap="jugmap" > </body> </html> im making a navigation image for my forum as an image map, but how do i find out what the co-ordinates are for the links i need? sorry if this doesnt make sence,anything else you need to know please ask Jake I can't seem to get my image map to work in FF, it works fine in IE. Also, can I do things with the CSS hover attribute with image maps? Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> Pl3x.net Introduction </title>
<!-- Link to external stylesheet -->
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<div class="intro">
<img src="images/IntroAni.gif" class="intro" usemap="#navmap" />
<map id="navmap" name="planetmap" class="navmap">
<area shape="rect" href="#" class="n1" coords ="0,0,100,100" />
<area shape="rect" href="#" class="n2" />
<area shape="rect" href="#" class="n3" />
<area shape="rect" href="#" class="n4" />
</map>
</div>
</body>
</html>
Code:
div.intro { margin: auto; height: 500px; width: 500px; }
map.navmap { border: 0px; }
img.intro { border: 0px; }
I have a question concerning a image map. I am creating a best buy/circuit city like email advertisement that will be sent out to users/members of a website. The email contains images (products) that the user will click on and will be directed to that product on the website to purchase. My question is, how do you email an image map? Is it possible? Or is there another way I should go about this all together? Alright, well I have a banner centered at the top of my page, http://www.hyphygraphix.com. I want to create an image map with 2 links where is says "Add Ash" and "Add HG" to my myspace pages. I want it to relevantly move with the image if a user where to use a larger/smaller resolution or if they choose to resize the browser. (I have this problem with the iframes too but I'll ask about that in a later thread) Can someone help me out? I have already created most of the site, and then decided to add the embedded google map. I'm not an html expert, so bare with me, but I understand the concepts to catch on easily. I know there is something wrong with the way I am trying to call the function to load the google map, but don't know the best way to handle it. I've tried several different methods and none seem to work. The map will load if I use certain settings, but that throws off all of the other pages. Additionally, when you click the map link, the gmap settings take over and all of the other pages inherit a gray background. The test site can be found at http://www.apriltillman.com/pickersp...stsite/ppp.htm any help is greatly appreciated. thanks, patrick Hi All! Im having a real problem removing image and image map outlines from my site at www.quickmarchminiatures.com In internet explorer all images have a border on click... please help.....Ive tried editing css Cheers Dan Can an image map be stored externally, and read in, when an image is read in? For my current project, I will have 67 different image maps, but for my next project, that will increase to 125 different image maps. George I just found out that a site I built for a nonprofit isn't working properly on Internet Explorer or Firefox. It does work on Safari. It appears the client-side image maps are the problem. I used <map> and <area> inside <img>. Here is some of my code: <img src="About.jpg" width="1100" height="825" usemap="about" /> <map name="about" /> <area shape="rect" coords="285,29,316,50" href="" title="HOME" alt="Home" /> <area shape="rect" coords="383,29,460,50" href="" title="FOR TEACHERS" alt="For Teachers" /> </map> (URLs removed intentionally to protect client's privacy.) I was going by the book, Beginning HTML, XHTML, CSS, and JavaScript, by John Duckett, published in 2010. According to this book, this is the recommended type of image map. It says this code should be compatible with today's most popular browsers. So does this type of image map simply not work on Internet Explorer and Firefox? Or is there something wrong with my code? What type of image map does work with all the major browsers? I have a jpeg (1600 x 1600) and a "view port" on my html page that measures 400x400. Can I put the entire jpeg "behind: the viewport somehow and enable the user to drag it around so as to be able to see the whole thing (like on Google Maps)? If there is an example somewhere of how to do this, could you point me to it? Thanks, JAS |
|||||||