Share full screen result
Embed on your page (embed options)
The challenge for this week is to design a turtle drawing program that accepts any form of user input in order to move, rotate and style a “pen” across a canvas. It should resemble the functionality demonstrated in the following diagram…
The important things we are looking for are the ability to change direction and then to move forward in a straight line. You can do this with HTML elements (and some interesting CSS) but we encourage the use of SVG or canvas in your solutions as they are more suited to the task.
Hint: you don’t have to have the labels on the left and you can use text fields (or even keyboard navigation) instead of links. What is important is how you maintain and modify direction and position of the “pen” (the point at the “front” of the line).
XHTML 1.0 Strict
XHTML 1.0 Transitional
HTML 4.01 Strict
HTML 4.01 Transitional
HTML 4.01 Frameset
Framework <script> attribute
Echo apis are created to simulate Ajax calls:
/echo/json/ for JSON,
//jsfiddle.net/echo/jsonp/ for JSONP,
/echo/html/ for HTML and
/echo/xml/ for XML.
Please read API documentation and follow
Created and maintained by Piotr and Oskar.
Hosted by DigitalOcean.
Insights from hotjar.
Special thanks to MooTools community.
All code belongs to the poster and no license is enforced.
JSFiddle or its authors are not responsible or liable for any loss or damage of any kind during the usage of provided code.
Please read the documentation.
For updates please follow our blog,
or become a fan.