I have updated the keyboard to use Additional attributes instead of class names.
v7
data-keytype
What ever the keytype is . i.e a hyphen (-) but word form.
examples:
data-keytype = alphakey
data-keytype = enterKey
data-keytype = shiftKey
data-symbolkey
what ever the symbol is . i.e a hyphen (-) in word form or for digits, their number.
examples:
data-symbolkey = hyphen
data-symbolkey = rightSquareBracket
data-symbolkey = semiColon
data-symbolkey = 9
Note that although digit keys are afaik not classed as symbols, I have given them the symbolkey attribute for simplicity in converting the code.
data-elkey
Is the initial character for the key element.
examples:
data-elkey = ]
data-elkey = a
data-elkey = =
new Keyboard_attribs_v7_ 2.zip (126.0 KB)
Mostly all that has been done is the keys have been given attributes depending on what they need (i.e not all share the same data key names)
The values for the attributes are the class names I used before.
And the code adjusted to look for the attributes instead of the class.
The keys no longer have innerHTML for it's key value initially.
This is now linked to the data-elkey attribute. And is set by ::before styling in a head css, which also uses the attribute.
So the code now just changes the data-elkey and the css will do the rest.