|
JavaScript - Google Adsense Rotate
I want to be able to rotate Adsense ads. 3/4 of the time, it will be someone else's. 1/4 of the time, it will be mine (my code is displayed already). However, the code I tried doesn't work. Can someone tell me how to fix this -
Code: <script language="JavaScript"> images = new Array(4); //the following string is really all on one line images[0] = '<script type="text/javascript">google_ad_client = "ca-pub-4811954214954647";google_ad_slot = "2713945203";google_ad_width = 728;google_ad_height = 90;</script><script type="text/javascript"src="http: //pagead2.googlesyndication.com/pagead/show_ads.js" ></script>'; images[1] = 'other code'; images[2] = 'other code'; images[3] = 'other code'; index = Math.floor(Math.random() * images.length); document.write(images[index]); //done </script> Similar TutorialsI am working on a site and essentially what I need to do is to autopost a blog entry that rotates based on each day. For example, Monday posts X, Tuesday posts Y, Wednesday posts Z, Monday posts X again. Much like this site does I know very little about javascript, but was wondering if something like this can be done? Would it be possible (with mootools or jquery) to have homepage that will rotate its home page content forwards and backwards based on either triangle or square? ie, you can rotate through 3, 4, etch home pages? Sort of like a slider, but it rotates off a center axis of the triangle or square? I wonder how we could rotate the div once the page is loaded. I tested it with a click button successfully in FF4.0.1. Yet, when I tried to use <body onload = "r()"> which the func r nested the whole rotate function with its global variables, it failed. Could anyone explain how I can do it automatically? Thanks for any help!!! <!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=utf-8" /> <title>JS + CSS3: MozTransform rotate</title> </head> <body> <style> .rDiv { width:200px; height:200px; position:absolute; top:40px; left:50px; text-align:center; color:white; line-height:200px; background-color:black; border-radius: 50%; border-styleutset; border-width:5px; border-color:white; /* transform: rotate(-1deg); -ms-transform:rotate(-1deg); -moz-transform:rotate(-1deg); */} .outdiv { width:300px; height:300px; position:absolute; top:0px; left:0px; background-color:grey;} </style> <div class="outdiv"> <div id = "rDiv" class="rDiv">ROTATE</div> </div> <script> var r = document.getElementById('rDiv'); var x = 0; function rotate(){ x += 1; r.style.MozTransform="rotate("+x+"deg)"; } </script> <input style="position:absolute; top:300px;" type="button" onclick="rotate()" value = "click me to rotate it!"/> </body> </html> Hi, I need some help for rotate and zoom image as in link below. any one can help me? http://kroppr.rborn.info/ http://crop.smally.net/ Hello, I am using the following script on my site RCENO .com in a easyadsense plugin, it is working well, because it is adding the elements after the posts on the page, but instead of rotating (This causes a problem when a Video is playing, and it rotates out in the middle of it) I would like for it to be Random when the posts load or refreshed....This is a Wordpress CMS site that provides News and Event Information to the local area, I am using this to display Holiday Greetings from area merchants in the form of Videos....... Thank You For Your assistance on This <script type="text/javascript"> if (document.all || document.getElementById){ //if IE4 or NS6+ document.write('<style type="text/css">\n') document.write('.dyncontent{display: none; width: 340px; height: 230px;}\n') document.write('</style>') } var curcontentindex=0 var messages=new Array() function getElementByClass(classname){ var inc=0 var alltags=document.all? document.all : document.getElementsByTagName("*") for (i=0; i<alltags.length; i++){ if (alltags[i].className==classname) messages[inc++]=alltags[i] } } function rotatecontent(){ //get current message index (to show it): curcontentindex=(curcontentindex<messages.length-1)? curcontentindex+1 : 0 //get previous message index (to hide it): prevcontentindex=(curcontentindex==0)? messages.length-1 : curcontentindex-1 messages[prevcontentindex].style.display="none" //hide previous message messages[curcontentindex].style.display="block" //show current message } window.onload=function(){ if (document.all || document.getElementById){ getElementByClass("dyncontent") setInterval("rotatecontent()", 75000) } } </script> Season Greetings: <div class="dyncontent" style="display: block">[flv:/files/videos/HolidayGreetings/FamilyVideoGreetings.flv 340 230]</div> <div class="dyncontent">To Add Your Holiday Greetings, Contact Us at Roy@rceno.com or Call (336) 398-6003</div> <div class="dyncontent">Happy Holidays</div> When I paste the adsense code on my website home page, between lines 387 and 397, the ad doesn't show. Much more strangely, it makes the ad coming from line 408 disappear - that one was visible before. Any ideas why? my site is roboticmagazine.com Thanks Hi, Is it possible to rotate a dial to follow the mouse cursor? I'm trying to recreate this: http://verbdesign.com/hl/rockwell/index.html but would rather it worked like this: http://www.actionscript.org/resource...-II/Page1.html ...but in javascript. Any help extremely welcome. Thanks, Richard So i have this weird problem that only occurs in IE, in combination with Adsense. I also tried FF and Chrome and it does not occur in those browsers. I use javascript to swap around divs, since css 'order' is not supported in every browser (at least not working for my iphone 4). The swapping is working fine in IE when you resize from a screen larger than 1024 to a screen smaller than 1024 and then to a screen larger than 1024. However it does not work well when you open the page/script in a screen smaller than 1024 and then make it larger (in IE). The sidebar 'aside' stays on the right side after 'article' instead of moving to the left. This only happens when i use adsense in the sidebar.. Otherwise it all works fine... Very weird to me.. Anyone who can help out? See this weird problem he JS Bin Here is the code: Code: <html>
<head>
<style>
html,
body {
padding: 0;
margin: 0;
background: #eee;
}
body {
padding: 0 3%
}
header,
footer,
.slogan,
.page-wrapper,
.headline-wrapper,
aside,
article {
box-sizing: border-box
}
.slogan,
aside,
article {
background: #fff
}
aside,
article {
padding: 20px;
border-radius: 10px;
margin: 10px 0 0 0;
-webkit-box-shadow: 0px 0px 2px 0px rgba(50, 50, 50, 0.5);
-moz-box-shadow: 0px 0px 2px 0px rgba(50, 50, 50, 0.5);
box-shadow: 0px 0px 2px 0px rgba(50, 50, 50, 0.5);
}
header,
footer {
padding: 20px
}
@media (min-width:1024px) {
.page-wrapper,
header,
footer {
width: 100%;
margin: 0 auto;
max-width: 1200px;
}
.page-wrapper {
display: table;
width: 100%;
padding-top: 50px;
max-width: 1200px;
margin: 0 auto;
}
.page-wrapper > aside,
.page-wrapper > article {
display: table-cell;
padding: 20px;
}
.page-wrapper aside {
width: 30%
}
article {
position: relative
}
.slogan {
padding: 0 20px;
border-bottom: 0px;
width: 100%;
margin: 0;
line-height: 50px;
height: 50px;
position: absolute;
left: 0;
top: -50px;
}
.slogan {
border-radius: 10px 10px 0 0;
-webkit-box-shadow: 0px -2px 2px 0px rgba(50, 50, 50, 0.3);
-moz-box-shadow: 0px -2px 2px 0px rgba(50, 50, 50, 0.3);
box-shadow: 0px -2px 2px 0px rgba(50, 50, 50, 0.3);
background: #ddd;
}
article {
border-radius: 0 0 10px 0
}
aside {
border-radius: 10px 0 0 10px
}
}
</style>
<script type='text/javascript' src='//code.jquery.com/jquery-1.9.1.js'></script>
<script type='text/javascript'>
function handleMargins() {
var width = (window.innerWidth > 0) ? window.innerWidth : screen.width;
if(width < 1024) {
$(".page-wrapper").each(function() {
var detach = $(this).find("aside").detach();
$(detach).insertAfter($(this).find("article"));
})
}
if(width >= 1024) {
$(".page-wrapper").each(function() {
var detach = $(this).find("article").detach();
$(detach).insertAfter($(this).find("aside"));
})
}
}
jQuery(document).ready(handleMargins);
$(window).resize(handleMargins);
</script>
</head>
<body>
<header>header</header>
<div class="page-wrapper">
<aside> sidebar <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- N_Responsief_Alle_CTR_AlleAdsenseSites -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-3961745091197220"
data-ad-slot="3968514626"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script></aside>
<article>
<h3 class="slogan">One line slogan only
</h3>
<p>This is the articlediv</p>
</article>
</div>
<footer>footer</footer>
</body>
</html>
Reply With Quote 12-23-2014, 03:35 PM #2 sunfighter View Profile View Forum Posts Senior Coder Join Date Jan 2011 Location Missouri Posts 4,830 Thanks 25 Thanked 672 Times in 671 Posts You need a doctype! maybe add <!DOCTYPE html> at the top of this code. IE needs a doctype or it is screwy. here's the code i've got to make some tabbed content on my website: Code: $(document).ready(function(){
$('#headingHome div').hide(); // Hide all divs
$('#headingHome div:first').show(); // Show the first div
$('.ticker_buttonP a:first').addClass('active'); // Set the class of the first link to active
$('.ticker_buttonP a').click(function(){ //When any link is clicked
$('.ticker_buttonP a').removeClass('active'); // Remove active class from all links
$(this).addClass('active'); //Set clicked link class to active
var currentTab = $(this).attr('href'); // Set variable currentTab to value of href attribute of clicked link
$('#headingHome div').hide(); // Hide all divs
$(currentTab).show(); // Show div with id equal to variable currentTab
return false;
});
});
and my html (all content removed for size's sake): Code: <div id="headingHome"> <div id="first"></div><!-- /first --> <div id="second"></div><!-- /second --> <div id="third"></div><!-- /third --> <div id="fourth"></div><!-- /fourth --> <div id="fifth"></div><!-- /fifth --> <p class="ticker_buttonP"> <a href="#first"></a> <a href="#second"></a> <a href="#third"></a> <a href="#fourth"></a> <a href="#fifth"></a> </p> </div><!-- /headingHome --> that works fine so far, however i want the content to fade in and out when the tabs change, and i also want the tabs to rotate automatically like seen on this site: http://www.sosfactory.com/ I'm new to this, and I cant find anything on the net about it that i can understand enough to put it together. could anyone help me, please? many thanks Ok, I am in a small pickle here. I created a sidebar gadget for work originally with only 4 images that needed to cycle though it. Easy enough script done. Now they have 6 images that need to rotate through. Easy enough again, script done. The issue I have is now I have to re-push this updated html file to all 1000 PC's on my network. Plus every time a change is made I will have to do it again. And we change the images multiple times a month. So what I need help doing if its possible is to modify the html file i am listing below to have a second IF parameter that not only steps the image but also checks to see if the file is even there. This is the spot I need help at. Code: function slideit(){
if (!document.images)
return
document.images.slide.src=eval("image"+step+".src")
whichimage=step
if (step<10)
step++
else
step=1
I wanted to add another part to the IF statement like maybe. Code: If (step<10 && file_exists("http://www.akronlibrary.org/Gadget/Gadget Pic 1.bmp"))
Basically a step that checks to see if I have at that moment a file named gadet pic 1. (I would do or statements for all of the file names) The point is to make this whole thing dynamic, so that I change image 1 on the server and every gadget on every PC looking for image 1 now see the new image. This way I just change the image file name when I want a different image to display. Same thing with the var for the slidelink function. points to a static named html file on my web server and I just change the redirect in the static named html file to go where i want it. I am by NO means a programmer, I am actually a network admin that came up with this idea and I am trying to fumble through it. Thanks in advance! Code: <html>
<head>
<meta hrrp-equiv="Content-Type" content="text/html; charset=Unicode" />
<style type="text/css">
body{
margin: 0px;
width: 405px;
height: 205px;
font-family; Georgia;
}
</style>
<script type="text/javascript">
var image1=new Image()
image1.src="http://www.akronlibrary.org/Gadget/Gadget Pic 1.bmp"
var image2=new Image()
image2.src="http://www.akronlibrary.org/Gadget/Gadget Pic 2.bmp"
var image3=new Image()
image3.src="http://www.akronlibrary.org/Gadget/Gadget Pic 3.bmp"
var image4=new Image()
image4.src="http://www.akronlibrary.org/Gadget/Gadget Pic 4.bmp"
var image5=new Image()
image5.src="http://www.akronlibrary.org/Gadget/Gadget Pic 5.bmp"
var image6=new Image()
image6.src="http://www.akronlibrary.org/Gadget/Gadget Pic 6.bmp"
var image7=new Image()
image7.src="http://www.akronlibrary.org/Gadget/Gadget Pic 7.bmp"
var image8=new Image()
image8.src="http://www.akronlibrary.org/Gadget/Gadget Pic 8.bmp"
var image9=new Image()
image9.src="http://www.akronlibrary.org/Gadget/Gadget Pic 9.bmp"
var image10=new Image()
image10.src="http://www.akronlibrary.org/Gadget/Gadget Pic 10.bmp"
</script>
</head>
<body>
<a href="javascript:slidelink()"><img title="Akron-Summit County Public Library" name="slide" /></a>
<script type="text/javascript">
var step=1
var whichimage=1
function slideit(){
if (!document.images)
return
document.images.slide.src=eval("image"+step+".src")
whichimage=step
if (step<10)
step++
else
step=1
setTimeout("slideit()",6000)
}
slideit()
function slidelink(){
if (whichimage==1)
window.location="http://www.akronlibrary.org/Gadget/Gadget Image 1 Link.html"
else if (whichimage==2)
window.location="http://www.akronlibrary.org/Gadget/Gadget Image 2 Link.html"
else if (whichimage==3)
window.location="http://www.akronlibrary.org/Gadget/Gadget Image 3 Link.html"
else if (whichimage==4)
window.location="http://www.akronlibrary.org/Gadget/Gadget Image 4 Link.html"
else if (whichimage==5)
window.location="http://www.akronlibrary.org/Gadget/Gadget Image 5 Link.html"
else if (whichimage==6)
window.location="http://www.akronlibrary.org/Gadget/Gadget Image 6 Link.html"
else if (whichimage==7)
window.location="http://www.akronlibrary.org/Gadget/Gadget Image 7 Link.html"
else if (whichimage==8)
window.location="http://www.akronlibrary.org/Gadget/Gadget Image 8 Link.html"
else if (whichimage==9)
window.location="http://www.akronlibrary.org/Gadget/Gadget Image 9 Link.html"
else if (whichimage==10)
window.location="http://www.akronlibrary.org/Gadget/Gadget Image 10 Link.html"
}
</script>
</body>
</html>
I have a page with a GoogleMap with a GoogleBar and I would like the GoogleBar to appear with something written in it already and to have that search executed. In other words, I would like to "write something to the GoogleBar and press Enter" automatically as soon as the map loads. How can I do this? btw: By GoogleBar, I mean the search bar that appears on the map after using the enableGoogleBar() function. Hi, I'm not sure where I have translated this incorrectly. I have one google map embedded on my page which works fine. But I wanted to add a second one. I thought the easiest way to do this would be to have a second page which is called later on with all the details on it for the second map. However although I think (this I presume is where I went wrong) I have replicated the instructions correctly the place holder for the second map just remains blank. This is the code for my called page with the instructions for the second map: PHP Code: <?php echo $_POST['Map'] . '<br />'; ?> <div id="placemap_canvas"></div> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html {height:250px} body {height:250px} #placemap_canvas {width:100%; height:150px;} </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true" /> </script> <script type="text/javascript"> var latlng = new google.maps.LatLng ( <?php include("dbconnect.php"); $result = mysql_query("SELECT * FROM regions WHERE RegionPId='{$_POST['Map']}'"); while($row = mysql_fetch_array($result)){ echo $row['maplink']; } mysql_close($con); ?> ); var myOptions = { zoom: 4, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("placemap_canvas"), myOptions); } </script> And this is the script of the main page, just in case I would be better off keeping them both in one place. Code: <head>
<script type="text/javascript">
function loadSubPlace(File,ID,Msg,Eile,EID,Esg){
loadXMLDoc1(File,ID,Msg);
var mimer = setTimeout(function(){loadXMLDoc1(Eile,EID,Esg)},5000);
}
</script>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html {height:250px}
body {height:250px}
#map_canvas {width:30%; height:250px;}
</style>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=true" />
</script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng (
<?php
include("dbconnect.php");
$result = mysql_query("SELECT * FROM countries
WHERE Country='{$_SESSION['Country']}'");
while($row = mysql_fetch_array($result)){
echo $row['Map'];
}
mysql_close($con);
?>);
var myOptions = {
zoom: 4,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
}
</script>
</head>
<body onload="initialize()">
<div class="countryright" id="map_canvas">
include("dbconnect.php");
$snowball=explode(';',$_POST['syringa']);
$turnsol=$snowball[1];
$violet =$snowball[2];
$wakerobin=$snowball[3];
global $turnsol;
global $violet;
global $wakerobin;
echo '<center><b><big>' . $wakerobin. '</big></b></center><br /><br />';
$result=mysql_query("SELECT * FROM regions
WHERE country='{$turnsol}' AND region='{$violet}' AND place='{$wakerobin}' AND sub !=''
ORDER BY sub ASC");
while($row = mysql_fetch_array($result)){
$wheat="{$row['RegionPId']};{$turnsol};{$violet};{$wakerobin};{$row['sub']}";
$tigerlilly=$row['RegionPId'];
echo '<input type="button" class="button3" name="place" id="place" value="' . $row['sub'] . '" onclick="loadSubPlace(\'getPlace.php\',\'txtHintPlaceSub\',\'hepatica=' . urlencode($wheat) . '\',\'getPlaceMap.php\',\'placemapcanvas\',\'Map=' . urlencode($tigerlilly) . '\');" />';
}
echo '<input type="button" class="button3" name="addplace" id="addplace" value="Add Place" onclick="loadXMLDoc1(\'getAddPlaceSub.php\',\'txtHintPlaceSub\', encodeURI(\'addsubplace=' . $_POST['syringa'] . '\'));" />';
echo '<br /><br /><div id="txtHintPlaceSub"></div><br /><br />';
mysql_close($con);
?>
I've cut out the script that doesn't relate to this so I hope I haven't missed anything important. Can the Google API replace scraping? You can get blocked by Google if you scrape, but can you get the same info from the Google API at no risk?
All, I'd like to have something similar to the rotating images and text on my website. The website that I would like to mimick is: http://www.photoworks.com/ You can see that the images move but there is still text over the image that I can click on. How would I go about doing something similar to this on my website. I'm guessing it's a combination of Javascript and CSS but I figured I'd start here. Thanks for any help in advance. Hi guys, I really need a custom google map, something like http://www.zeemaps.com/ offers, Where you can: Add placemarkers to a map by clicking an add button A sidebar with all locations listed Info windows when you click on markers giving you information And a couple of other features! I would really appreciate some help, spent 3 days on this now and i have: Code: <!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Example</title>
<script src="http://maps.google.com/maps?
file=api&v=2.x&key=ABQIAAAAWRAYgBXwUGsMlXv1A5Q4bBRI_5kORY0Qfu7GdhaM1xc6on2HoBT-8FUS12kkCbVXsWHjVsqeAyFq5Q&sensor=false"
type="text/javascript"></script>
<script type="text/javascript">
function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(54.77534585936447, -2.5927734375), 6);
map.setUIToDefault();
}
var publisher_id = 'ca-pub-4595198420871047';
var adsManagerOptions = {
maxAdsOnMap : 4,
style: G_ADSMANAGER_STYLE_ADUNIT,
// The channel field is optional - replace this field with a channel number
// for Google AdSense tracking
//channel: 'your_channel_id'
};
adsManager = new GAdsManager(map, publisher_id, adsManagerOptions);
adsManager.enable();
}
</script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="map_canvas" style="width: 100%; height: 100%"></div>
</body>
</html>
Hi, I have just set up google analytics on my website but it is showing tracking unknown symbol in the status. Is it just the case of it taking time to set up or should it work straight away. Thanks Tyler Hello Everyone! I'm new to the forums but have a question with Google Translate I'm trying to add to my site. I believe the code for Google Translate is a Java Script and I'd like to put this on my website in the side column. The only thing I would like to modify is a <br> (break) between the Powered by and Google Translate. So I would like it to be center aligned like: Powered by Google Translate Right now it is stretching out the column because of the added space and frustrating me! Any idea how to do this? Here is the code: Code: <div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'en'
}, 'google_translate_element');
}
</script><script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
My knowledge of javascript and coding in general is very very limited so any changes you make or where I should put the code, definitely let me know Thanks, Phil I have some problems with intergrating google maps into my page I cant seem to get a marker to appear on my map. I have tried numerous methods but non seem to work. I have integrated the google maps on my main site, repositioned and re-sized. The code below is a test page i work on to get code to work. It's just a map on a page entire code: <!DOCTYPE HTML> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 25px; padding: 25px } #map_canvas { height: 100% } </style> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDrxZnpYBNIwzBFVYaDY__BMONEjNEGZaI&sensor=false"> </script> <script type="text/javascript"> function initialize() { var myLatlng = new google.maps.LatLng(-25.363882,131.044922); var myOptions = { zoom: 4, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);} var marker = new google.maps.Marker({ position: myLatlng, map: map, title:"Hello World!" }); </script> </head> <body onload="initialize()"> <div id="map_canvas" style="width:100%; height:100%"></div> </body> </html> can anybody tell my where i am going wrong and just the map appears with no marker? thanks I'm completely at a loss how to embed a map with the new google maps api setup. I found a snippet of code that I dropped in with some small database variables pulled in and was done. Then an error came that the API was no good. So I went in and set up an anaccount, got an api and now I just simply have no clue what their instructions are saying I need to do. Gah! Here's what I originally had: I now have a Client ID, client secret and stuff. But no clue how to set up this url, etc. Code: </script>
<script src="//maps.google.com/maps?file=api&v=2&key=AIzaSyD4iE2xVSpkLLOXoyqT-RuPwURN3ddScAI"
type="text/javascript"></script>
<script type="text/javascript">
function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(<?php echo $c_row['location_longitude']; ?>,<?php echo $c_row['location_latitude']; ?>), 13);
// Add the latitude/longitude marker to the map
var point = new GLatLng(<?php echo $c_row['location_longitude']; ?>,<?php echo $c_row['location_latitude']; ?>);
map.addOverlay(new GMarker(point));
map.setUIToDefault();
}
}
</script>
<b>Map:<br><br><div id="map_canvas" style="width: 500px; height: 300px; z-index:4000;border-width:medium;border-color:#030;"></div></b>
Hey all I'm quite a newbie at javascript and I'm trying to have links to google maps markers. I have a page with my embeded google maps on it and some markers. What I'm basically looking to do is have a web page with a menu down the side and when you click the menu items, the google maps markers would pop up on the map. For example, city attractions down a side menu and when you click say restaurants, the markers would pop up the location restaurants in a certain place, then you could click pubs and the restaurant markers would dissapear and the pub markers would appear. Can anyboy help me with this or even direct me to some code that would help. Thanks all. |
|||||||