Simple fix, you need to put those observers inside the proper
document.observe('dom:loaded') block for them to actually know when and what
to start observing.i posted your demo - fixed: http://www.genevajs.com/misc/demo-ps-list-0013.php cope/paste as needed. be sure to update the <script> tags... those paths are my paths, i thinkyours were /javascripts/lib/ and /javascripts/src/ Rick On Fri, Jun 5, 2009 at 9:00 PM, MIGhunter <ad...@botdls.com> wrote: > > Nothing I do seems to be working with IE. I thought that prototype/ > scriptaculous was supposed to fix IE's retardedness. > > I tried using the following code. It works for FF but not IE: > http://paste.windower.net/f3dd16107 > > <html> > <head> > <title>Move 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 <http://maps.google.com/maps/api/%0Ajs?sensor=true> > "></script> > <script type="text/javascript"> > 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()"> > > <div id="parallel_demo" style="position:relative; left: -1000px;"><div > id="map_canvas" style="width:75%; height:75%"></div></div> > <ul> > <li><a href="#" id="animate_parallel_demo">Show the Map</a></li> > <li><a href="#" id="reset_parallel_demo">Hide the map</a></li> > </ul> > </div> > > <script type="text/javascript"> > $('animate_parallel_demo').observe('click', function(event) { > event.stop(); > > new Effect.Parallel([ > new Effect.Move('parallel_demo', { sync: true, x: 1000, y: 0, > mode: 'relative' }), > new Effect.Opacity('parallel_demo', { sync: true, from: 0, to: > 1 }) > ], { > duration: 1.5 > }); > }); > > $('reset_parallel_demo').observe('click', function(event) { > event.stop(); > > $('parallel_demo').setStyle({ > top: 0, > left: -200, > opacity: 0 > }); > }); > </script> > > > </body> > </html> > > > On Jun 5, 2:59 pm, Matt Foster <mattfoste...@gmail.com> wrote: > > > 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? > > > > Yeah, having it display:none or visibility:hidden can muck up the > > calculations of the containers dimensions. I'd suggest the good ole > > trick of "hiding" IFrames, which is just set the container as > > { position:absolute; left: -4000px; } This way the map is off the > > view port hence "invisible" to the user and yet fully accessible via > > the DOM for dimension calculations. > > > > Thinking more about it, you may not want to instantiate the map until > > you're ready, nothing says it has to be done on page load, I had done > > some work with Ext.js and Google maps, where Ext does the DOM element > > creation all via JS execution, i loaded the map only when it was > > necessary. > > > > http://positionabsolute.net/projects/javascript/ext/googleservice/ > > > > -- > > > > http://positionabsolute.net > > > > On Jun 5, 5:09 am, MIGhunter <ad...@botdls.com> wrote: > > > > > 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 -~----------~----~----~----~------~----~------~--~---
