I'm trying to use a script to hide and show user information. Right now I am just playing with it and here is what I have: http://migcfdesign.com/joani/index.html
The problem is the map. I can't load the page with the map hidden. If I do chops off 1/2 of the map. Is there a way to initially load the page with the map open and then close it after a timed period? Better yet, is there some way to load it with it hidden but not chopped up? I'm not sure what's the conflict is between google's js and prototype.js. The url to a copy of the map messing up is: http://migcfdesign.com/joani/index2.html Here is the code I am using: <html> <head> <title>Toggle Test</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" / > <meta name="viewport" content="initial-scale=1.0, user-scalable=no" / > <script src="/javascripts/lib/prototype.js" type="text/javascript"></ script> <script src="/javascripts/src/scriptaculous.js" type="text/ javascript"></script> <script type="text/javascript" src="http://maps.google.com/maps/api/ js?sensor=true"></script> <script type="text/javascript"> Event.observe(window, 'load', function() { Event.observe('featurebox-3-listen', 'click', function(){ $('featurebox-3').toggle(); }); }); Event.observe(window, 'load', function() { Event.observe('featurebox-4-listen', 'click', function(){ $('featurebox-4').toggle(); if($('featurebox-4').hide()){ $('featurebox-4-listen').update('(812)555-5555'); } else { //do nothing. } }); }); Event.observe(window, 'load', function() { Event.observe('featurebox-5-listen', 'click', function(){ $('featurebox-5').toggle(); if($('featurebox-5').hide()){ $('featurebox-5-listen').update('#### Street Bloomington, IN 47401'); } else { //do nothing. } }); }); function initialize() { var latlng = new google.maps.LatLng(39.1485520, -86.5857814); var myOptions = { zoom: 13, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById ("map_canvas"), myOptions); } </script> </head> <body onload="initialize()"> <table> <tr> <td><img src="images/map_symbol.jpg" alt="Map" title="Map"></td> <td><p><span id="featurebox-3-listen"><a href="#"><strong>Map (Hide) </strong></a></span> | <span onclick="$('featurebox-3').toggle();"><a href="#"><strong>Map (Show)</strong></a></span></p></td> <div class="featurebox" id="featurebox-3"><div class="featurebox" id="featurebox-2"> <p><div id="map_canvas" style="width:50%; height:50%"></div></p> </div> </tr> <tr> <td><img src="images/phone_symbol.jpg" alt="Phone" title="Phone Number"></td> <td><span id="featurebox-4-listen"><a href="#"><strong>Phone Number</ strong></a></span></td> <div class="featurebox" id="featurebox-4"><div class="featurebox" id="featurebox-2"></div> </tr> <tr> <td><img src="images/house.jpg" alt="House" title="Address"></td> <td><span id="featurebox-5-listen"><a href="#"><strong>Address</ strong></a></span></td> <div class="featurebox" id="featurebox-5"><div class="featurebox" id="featurebox-2"></div> </tr> </table> </body> </html> --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group. To post to this group, send email to prototype-scriptaculous@googlegroups.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~----------~----~----~----~------~----~------~--~---
