tamsvg wrote: > I've created some rectangles. With the event onmouseover the > rectangles become another fill-colour. It works when I move the > mouse pointer very slowly. If I move it more fast, it doesn't work > (No colour change). Why? > > Heres the code: > > <?xml version='1.0' encoding='ISO-8859-1' ?> > <svg width="30cm" height="30cm" xmlns="http://www.w3.org/2000/svg";> > <script type="text/javascript"> > > function eventover(evt) > { > var raum = evt.getTarget(); > var style = raum.getStyle(); > var fillr = style.getPropertyValue('fill'); > style.setProperty('fill', 'red'); > } > function eventout(evt) > { > var raum = evt.getTarget(); > var style = raum.getStyle(); > var fillr = style.getPropertyValue('fill'); > style.setProperty('fill', 'none'); > } > function eventclick(evt) > { > var raum = evt.getTarget(); > var text = raum.getAttribute('id'); > > var output = "Sie haben auf "+text+" > geklickt!"; > alert(output); > } > > </script> > <rect id="Raum 1 (Nutzung: Arbeitsraum, Personenzahl: 3)" > width="5cm" x="2cm" y="2cm" height="5cm" onmouseout="eventout(evt)" > onclick="eventclick(evt)" style="stroke:black; fill:none; stroke- > width:1" onmouseover="eventover(evt)"/> > <rect id="Raum 2 (Nutzung: Arbeitsraum, Personenzahl: 3)" > width="5cm" x="7.2cm" y="2cm" height="5cm" onmouseout="eventout > (evt)" onclick="eventclick(evt)" style="stroke:black; fill:none; > stroke-width:1" onmouseover="eventover(evt)"/> > <rect id="Raum 3 (Nutzung: Flur, Personenzahl: 10)" width="10.2cm" > x="2cm" y="7.2cm" height="3cm" onmouseout="eventout(evt)" > onclick="eventclick(evt)" style="stroke:black; fill:none; stroke- > width:1" onmouseover="eventover(evt)"/> > <rect id="Raum 4 (Nutzung: Arbeitsraum, Personenzahl: 3)" > width="5cm" x="2cm" y="10.4cm" height="5cm" onmouseout="eventout > (evt)" onclick="eventclick(evt)" style="stroke:black; fill:none; > stroke-width:1" onmouseover="eventover(evt)"/> > <rect id="Raum 5 (Nutzung: Teek�che, Personenzahl: 1)" width="5cm" > x="7.2cm" y="10.4cm" height="3cm" onmouseout="eventout(evt)" > onclick="eventclick(evt)" style="stroke:black; fill:none; stroke- > width:1" onmouseover="eventover(evt)"/> > </svg>
This one is easy: you have set fill:none, so the rectangles are reduced to their border: events can happen only when the cursor is over the stroke of the rectangle, which is quite thin, hence the need to go slowly, because events are not fired for each pixel moved, but probably at given time intervals. Workaround: use fill:white or whatever value that fit your drawing. Perhaps with opacity:1, if you need to see throught the rectangles. BTW, your ids are quite complex, and perhaps even illegals (I don't know the exact limits of the XML standard). If you want to carry complex information, you should use metadata inside the rect element: <rect id="Raum5" ...> <desc>Nutzung: Teek�che, Personenzahl: 1</desc> </rect> for example; or even use private namespace elements/attributes. -- Philippe Lhoste -- (near) Paris -- France -- Professional programmer and amateur artist -- http://Phi.Lho.free.fr -- For servers mangling my From and Reply-To fields, -- please send private answers to PhiLho(a)GMX.net -- -- -- -- -- -- -- -- -- -- -- -- -- -- ------------------------ Yahoo! Groups Sponsor --------------------~--> Make a clean sweep of pop-up ads. Yahoo! Companion Toolbar. Now with Pop-Up Blocker. Get it for free! http://us.click.yahoo.com/L5YrjA/eSIIAA/yQLSAA/1U_rlB/TM --------------------------------------------------------------------~-> ----- To unsubscribe send a message to: [EMAIL PROTECTED] -or- visit http://groups.yahoo.com/group/svg-developers and click "edit my membership" ---- Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/svg-developers/ <*> To unsubscribe from this group, send an email to: [EMAIL PROTECTED] <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
