The latest articles on DEV Community by wiki-javascript (@wikijavascript). https://dev.to/wikijavascript https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F221572%2F2fec771e-d0cc-43ea-8251-c6bb6f7d8fe0.png https://dev.to/wikijavascript en wiki-javascript Sun, 28 Jun 2020 05:22:53 +0000 https://dev.to/wikijavascript/image-transition-effect-in-16-lines-of-pure-js-1j3 https://dev.to/wikijavascript/image-transition-effect-in-16-lines-of-pure-js-1j3 <p>Floodfill - easy tutorial:</p> <p><a href="https://slicker.me/javascript/image_transition_effect.htm">https://slicker.me/javascript/image_transition_effect.htm</a></p> javascript tutorial html canvas wiki-javascript Sat, 31 Aug 2019 15:36:05 +0000 https://dev.to/wikijavascript/turtle-graphics-in-javascript-the-goofball-way-43a https://dev.to/wikijavascript/turtle-graphics-in-javascript-the-goofball-way-43a <p><a href="http://slicker.me/javascript/turtle.htm">http://slicker.me/javascript/turtle.htm</a></p> <p>Turtle graphics is available for example in Logo (since 1960s) and Python, but not in JavaScript.<br> Or is it? It dawned on me that context.rotate basically emulates 'turn left/right' and context.translate combined with moveTo/drawTo behaves just like 'move forward/back'.<br> This is definitely not an elegant or scalable way of programming graphics - kind of like tying your shoe with an earthworm: it looks cool, but only works in certain conditions. Just another gizmo in my collection of weird code. If you to play with real turtle graphics, I suggest you use one of the many available JS libraries, Python or Logo. Or at least create actual functions that move and rotate the turtle to make your code readable.</p> javascript html coding tutorial