Hi all,
I'm currently writing an application that displays a floor plan using
SVG, embedded within an HTML div.
I'm writing the javascript code to make the floor plan interactive,
allowing you to select rooms etc. However I've hit a snag.
I was writing a simple function to let me change a room's colour when
it's clicked. I set up the CSS class I wanted to add to the element
that was clicked, and created the onclick function, here's how it

function select_room(num) {

  index = selected.indexOf(num); // find the index of the room number
in the array
  if (index < 0) { // If the room number isn't in the selected array

          selected.push(num); // add the number to the array
          $('room'+num).addClassName("selected"); // Use addClassName to add
the "selected" class to the room

  } else { // If the room's already selected

          selected[index] = null; // remove the number from the array
          selected = selected.compact(); // Remove the null index from the
          $('room'+num).removeClassName("selected"); // Use removeClassName
to remove the "selected" class.


  $('selected').value = selected;


However, when the function ran, I got the error "$
('room'+num).addClassName is not a function". After some head-
scratching and a bit of debugging, I realised that $('room'+num) is
returning an SVG element instead of an HTML element (as described in
the API docs). Does this mean that the associated methods aren't
available? Is there any workaround to make (at least the applicable
ones) available?
Many thanks,

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 
For more options, visit this group at 

Reply via email to