css - JavaScript NOT operator on Boolean -
so got piece of code work, i'm having trouble understanding why works. css has sprite sheet animates box morphing circle.
the animation-play-state : paused;
rule in css keeps sprite starting animation till key pressed see in javascript code.
my question why if execute code block when keycheck
false
. knowledge of how !
operator works, isn't code suppose execute when keycheck
"not" false ? initial value false
why run ?
the code suppose stop event executing repeatedly when key held down.
keycheck = false; window.addeventlistener("keydown", checkkey_dn, false); window.addeventlistener("keyup", checkkey_up, false); function checkkey_dn(e) { if(e.keycode == "83" && !keycheck){ keycheck = true; $("boxmorph").style.animationplaystate = "running"; $("boxmorph").style.webkitanimationplaystate = "running"; $("boxmorph").style.visibility = "visible"; $("boxmorph").classlist.remove ("boxes"); $("boxmorph").offsetwidth = $("boxmorph").offsetwidth; $("boxmorph").classlist.add ("boxes"); } } function checkkey_up(e){ if(e.keycode == "83"){ keycheck = false; $("boxes").style.visibility = "hidden"; } }
this piece of code helps re-animate css sprites.
$("boxmorph").classlist.remove ("boxes"); $("boxmorph").offsetwidth = $("boxmorph").offsetwidth; $("boxmorph").classlist.add ("boxes");
you've misunderstood not - returns inverse of value:
if(false) { /* block not executed */ } if(!false) { /* block executed */ }
this because !false
evaluates true
, equivalent to:
if(true) { /* block executed */ }
the check if(!keycheck)
succeed only when value of keycheck falsy, e.g. keycheck = false
.
Comments
Post a Comment