Hello! I am trying to check when the user clicks out site of a few tables. Here is the site I am working on : http://www.tvi.iol.pt/eurotvi That is the production site and the code is not there, it''s on a local copy of the site Here is the javascript code: <script type="text/javascript"> //Event.observe(window, ''click'', function(e) { document.body.onclick = function(e) { var fora = true; var tables = document.body.getElementsByTagName("tbody"); for (var i = 0,tables_total = tables.length;i<tables_total;i++) { var offset = tables[i].cumulativeOffset(); var size = tables[i].getDimensions(); var x = Event.pointerX(e); var y = Event.pointerY(e); if ((x >= offset.left && x < (offset.left + size.width)) && (y > offset.top && y < (offset.top + size.height))) { fora = false; alert("MouseX: " + x +"\nMouseY:" + y + "\nOffsetlef: " + offset.left + "\nOffsettop:"+ offset.top + ""); tables[i].setAttribute("style","border:10px solid red"); } } if (fora) alert("Tou fora"); } //}); </script> I had to use "document.body.onclick" because the "Event.observe(window, ''click'', function(e)" was not registering on ie6 and ie7, This code is placed right after the <body> tag. The problem is with var offset = tables[i].cumulativeOffset(); On ff 2.0.0.14 I get no errors, the code works great. On IE6 and IE7 I get an error on that line saying: "The object does not support this propertie or method. I thought prototype was cross-browser. I really need this to work, please someone help me out!! Thanks --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Try this: <script type="text/javascript"> Event.observe(document.body, ''click'', function(e) { alert("You have clicked the body"); }); Event.observe(window, ''load'', function(e) { $$(''tbody'').invoke(''observe'', ''click'', function(e) { Event.stop(e); // keeps the event from bubbling up to document.body }); }); </script> I haven''t test it, but I''m doing something similar to show/hide html tooltips. AntonioCS wrote:> Hello! I am trying to check when the user clicks out site of a few > tables. > > Here is the site I am working on : http://www.tvi.iol.pt/eurotvi > That is the production site and the code is not there, it''s on a local > copy of the site > > Here is the javascript code: > <script type="text/javascript"> > > //Event.observe(window, ''click'', function(e) { > document.body.onclick = function(e) { > var fora = true; > var tables = document.body.getElementsByTagName("tbody"); > > for (var i = 0,tables_total = tables.length;i<tables_total;i++) { > var offset = tables[i].cumulativeOffset(); > var size = tables[i].getDimensions(); > var x = Event.pointerX(e); > var y = Event.pointerY(e); > > if ((x >= offset.left && x < (offset.left + size.width)) && (y > > offset.top && y < (offset.top + size.height))) { > fora = false; > alert("MouseX: " + x +"\nMouseY:" + y + "\nOffsetlef: " + > offset.left + "\nOffsettop:"+ offset.top + ""); > tables[i].setAttribute("style","border:10px solid red"); > } > } > if (fora) > alert("Tou fora"); > } > //}); > </script> > > I had to use "document.body.onclick" because the > "Event.observe(window, ''click'', function(e)" was not registering on > ie6 and ie7, > This code is placed right after the <body> tag. The problem is with > var offset = tables[i].cumulativeOffset(); > On ff 2.0.0.14 I get no errors, the code works great. > On IE6 and IE7 I get an error on that line saying: "The object does > not support this propertie or method. > > I thought prototype was cross-browser. I really need this to work, > please someone help me out!! > > Thanks > > > >--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Someone on #prototype has helped me and gave me similar code: document.body.onclick = function(e) { var fora = true; $$("tbody").each(function(t) { var offset = t.cumulativeOffset(); var size = t.getDimensions(); var x = Event.pointerX(e); var y = Event.pointerY(e); if ((x >= offset.left && x < (offset.left + size.width)) && (y > offset.top && y < (offset.top + size.height))) { fora = false; alert("MouseX: " + x +"\nMouseY:" + y + "\nOffsetlef: " + offset.left + "\nOffsettop:"+ offset.top + ""); } //alert(offset); }); if (fora) window.open("fora"); the problem now with this code is that I get an error on the pointerX What am I doing wrong here? I am passing the event but in IE7 and gives me the error: ''pageX'' is null or not an object :( On Jun 3, 11:25 pm, Hector Virgen <djvir...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> Try this: > > <script type="text/javascript"> > > Event.observe(document.body, ''click'', function(e) { > alert("You have clicked the body"); > > }); > > Event.observe(window, ''load'', function(e) { > $$(''tbody'').invoke(''observe'', ''click'', function(e) { > Event.stop(e); // keeps the event from bubbling up to document.body > }); > > }); > > </script> > > I haven''t test it, but I''m doing something similar to show/hide html > tooltips. > > AntonioCS wrote: > > Hello! I am trying to check when the user clicks out site of a few > > tables. > > > Here is the site I am working on :http://www.tvi.iol.pt/eurotvi > > That is the production site and the code is not there, it''s on a local > > copy of the site > > > Here is the javascript code: > > <script type="text/javascript"> > > > //Event.observe(window, ''click'', function(e) { > > document.body.onclick = function(e) { > > var fora = true; > > var tables = document.body.getElementsByTagName("tbody"); > > > for (var i = 0,tables_total = tables.length;i<tables_total;i++) { > > var offset = tables[i].cumulativeOffset(); > > var size = tables[i].getDimensions(); > > var x = Event.pointerX(e); > > var y = Event.pointerY(e); > > > if ((x >= offset.left && x < (offset.left + size.width)) && (y > > > offset.top && y < (offset.top + size.height))) { > > fora = false; > > alert("MouseX: " + x +"\nMouseY:" + y + "\nOffsetlef: " + > > offset.left + "\nOffsettop:"+ offset.top + ""); > > tables[i].setAttribute("style","border:10px solid red"); > > } > > } > > if (fora) > > alert("Tou fora"); > > } > > //}); > > </script> > > > I had to use "document.body.onclick" because the > > "Event.observe(window, ''click'', function(e)" was not registering on > > ie6 and ie7, > > This code is placed right after the <body> tag. The problem is with > > var offset = tables[i].cumulativeOffset(); > > On ff 2.0.0.14 I get no errors, the code works great. > > On IE6 and IE7 I get an error on that line saying: "The object does > > not support this propertie or method. > > > I thought prototype was cross-browser. I really need this to work, > > please someone help me out!! > > > Thanks--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
IE doesnt have an onclick event for the window object. Prototype is cross browser but it doesnt support adding that missing event (it would have to fallback to document.body or something, messy). You are getting your pointerX error because you are probably clicking on the body before it finishes loading (dom loaded). This will be fixed in the next release of Prototype. For now you can do: document.observe(''dom:loaded'', function() { $(document.body).observe(''click'', function(e) { var element = e.findElement(''tbody''); if(element == document) window.open(''fora''); }); }); - JDD --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---