Hi,
in my example it was an array of DOM objects, but you can do it with an array
of ID strings, then browse the array with
document.getElementById(yourListOfElements[ind]).
You can manage with only one click event listener by testing the target,
instead of attaching to each element :
document.addEventListener('click',function(e) {
var ind = yourListOfElements.indexOf(e.target); //check if the target is
in your array
if (ind === -1) { return; }
else { focusOnElement(ind); }
},false);
I think you have to master DOM events before going further, because this is not
specific to SVG development.
https://developer.mozilla.org/en/DOM/event
Cheers,
Yannick
http://ybochatay.fr
----- Mail original -----
De: "Stefan Schwarzer" <[email protected]>
À: [email protected]
Envoyé: Vendredi 14 Octobre 2011 12:03:00
Objet: Re: [svg-developers] Use the cursor (arrows) to move up and down
elements?
Thanks a lot for that.
Would the elements be listed in the first line as [g4, g8, g12....] or as
["g4", "g8", "g12"...]?
Do I need to add a onclick event to the text elements from which then the
navigation (up, down) be initiated?
Stef
On Oct 13, 2011, at 6:48 AM, [email protected] wrote:
> Hi,
> I wrote something quickly (no test), are you looking for something like that ?
> Regards,
>
> Yannick Bochatay
> http://ybochatay.fr
>
> var yourListOfElements = [ elmt1, elmt2 /*, etc */ ];
> var currentElement = false;
>
> var focusOnElement = function(ind) {
>
> if (currentElement) { /* code to blur yourListOfElements[currentElement] */ }
> /* code to focus on yourListOfElements[ind] */
> currentElement = ind; //
> };
>
> var keypressFunc = function(e) {
> if (currentElement === false) { return; } //no action if no element is
> displayed
> if (e.keyCode === 38) { focusOnElement(currentElement-1); } //up arrow
> else if (e.keyCode === 40) { focusOnElement(currentElement+1); } //down arrow
> };
> document.addEventListener('keypress',keypressFunc,false);
>
> yourListOfElements.forEach(function(elmt,ind) {
> elmt.addEventListener('click',function() {focusOnElement(ind);},false);
> });
>
> ----- Mail original -----
> De: "luftikus_143" <[email protected]>
> À: [email protected]
> Envoyé: Mercredi 12 Octobre 2011 13:36:47
> Objet: [svg-developers] Use the cursor (arrows) to move up and down elements?
>
> Hi there,
>
> I saw when searching around that there is the possibility that SVG elements
> react on cursors. I would like that the user clicks on an text-element, and
> then has the possibility to use the arrows (up, down) of the keyboard to move
> up and down and display the next elements.
>
> Is that possible? And what do I need for this?
>
> Thanks a lot for any hints!
>
>
[Non-text portions of this message have been removed]
------------------------------------
-----
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 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/
<*> Your email settings:
Individual Email | Traditional
<*> To change settings online go to:
http://groups.yahoo.com/group/svg-developers/join
(Yahoo! ID required)
<*> To change settings via email:
[email protected]
[email protected]
<*> 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/
