ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.
One of a set of tools we're offering as a way to say thank you for being a part of the community.
Course Of The Month
5 days, 15 hours left to enrollBecome a Premium Member and unlock a new, free course in leading technologies each month.
Solved
Toggle effect on a button
Posted on 2011-09-08
I have just added a "zoom in" button into an info window within a Google Map (you can see it working here http://www.soundsairpark.com/sandpit/mapTest2.html).
What I would like to do is have the button change so that after it has been clicked and "zoomed in" the button value will change to "zoom out" and the onclick event will set the zoom level back to its default 8.
Cheers,
N
What I would like to do is have the button change so that after it has been clicked and "zoomed in" the button value will change to "zoom out" and the onclick event will set the zoom level back to its default 8.
Cheers,
N
// code shows my info window and the zoom button
var marker = createMarker(point,'<div style="width:240px; font-family:Arial; font-size:14px"> <input type="button" id="zoom" value="Zoom" onclick="map.setZoom(15)"/><\/div>')
[X]
Welcome to Experts Exchange
Add your voice to the tech community where 5M+ people just like you are talking about what matters.
- Help others & share knowledge
- Earn cash & points
- Learn & ask questions
-
2
4 Comments
Active 3 days ago
have figured out how to update the button value but not toggle between zooming in and out
http://www.soundsairpark.com/sandpit/mapTest-toggle.html
http://www.soundsairpark.com/sandpit/mapTest-toggle.html
Active 3 days ago
Check this :
<!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>Google Maps JavaScript API Example: Ground Overlays</title>
<script src="//maps.google.com/maps?file=api&v=2&key=ABQIAAAAI8kIB4hk8gD-5yrnCohd5RSkwzceBTFrUE_2xjvYDKmGarCKKBSCCpAUeziDLbQ5V2Ky46IDwydShg" type="text/javascript"></script>
</head>
<body onunload="GUnload()">
<div id="map" style="width: 800px; height: 600px"></div>
<script type="text/javascript">
//<![CDATA[
if (GBrowserIsCompatible()) {
function createMarker(point,html) {
var marker = new GMarker(point);
GEvent.addListener(marker, "click", function() {
//marker.openInfoWindowHtml(html); // NOT SURE YOU STILL WANT THIS ELSE UNCOMMENT
map.setCenter(marker.getLatLng());
if( map.getZoom() != 8 ) {
map.setZoom(8);
}
else {
map.setZoom(15);
}
});
return marker;
}
// Display the map, with some controls and set the initial location
var map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(-41.34204, 173.957801),8);
map.setMapType(G_HYBRID_MAP);
// Set up marker with info windows
var point = new GLatLng(-41.34204, 173.957801);
var marker = createMarker(point,'<div style="width:240px; font-family:Arial; font-size:14px"><img src="http://www.soundsairpark.com/sandpit/images/structure/logo-icon.png" width="66" height="48" style="float:left; margin-right:10px">Marlborough Sounds <br>Air Park<br>SH1, Picton. NZ<br><\/div>');
map.addOverlay(marker);
// ground overlay
var boundaries = new GLatLngBounds(new GLatLng(-41.34630,173.95099), new GLatLng(-41.33990,173.9610));
var oldmap = new GGroundOverlay("http://www.soundsairpark.com/images/map-overlay.png", boundaries);
map.setUIToDefault();
map.addOverlay(oldmap);
}
//]]>
</script>
</body>
</html>
Featured Post
Question has a verified solution.
If you are experiencing a similar issue, please ask a related question
Shoutout to Emily Plummer (http://www.experts-exchange.com/members/eplummer26.html) for giving me this article! She did most of it, I just finished it up and posted it for her :)
Introduction
In a previous article (http://www.experts-exchang…
JavaScript has plenty of pieces of code people often just copy/paste from somewhere but never quite fully understand.
Self-Executing functions are just one good example that I'll try to demystify here.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page.
Reference your jQuery libraries: (CODE)
Include your new external js/jQuery file: (CODE)
Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses
Course of the Month5 days, 15 hours left to enroll
705 members asked questions and received personalized solutions in the past 7 days.
Join the community of 500,000 technology professionals and ask your questions.