MDN Holidays calendar

Welcome to the holiday calendar of the Mozilla Developer Network. Behind each of the days on the below calendar lies a resource or interesting demo for you to look at, enjoy and - if they are MDN resources and you want to - even give some editing love.

  1. Simple CSS dropdown effects

    A collection of effects for a CSS dropdown ranging from simple stacking to fanning out

    You can also see it in action here.

  2. Live Samples on MDN

    Code examples are great but did you know that the MDN Wiki now also allows you to add live samples that show the code and the results inline? Try it out!

  3. Move mouse to reveal images

    This little demo uses D3.js and canvas to create an image from dots. Move your mouse over the dots to make 4 out of 1 and get the right colours until you revealed the whole image.

  4. Heyoffline.js

    A JavaScript library to warn users when they are offline.

  5. Shaky diagramming

    A script to create seemingly hand-written diagrams from their ASCII sources. Uses Dart and Canvas

  6. Native CSS feature detection via the @supports rule

    Will Modernizr be soon obsolete as browsers can detect support for features natively for you?

  7. Dat.gui

    You've probably seen this in quite a few demos - a GUI to allow users to play with JavaScript values.

  8. Web Developer Personas

    In order to reach an audience and build the right things for them Personas have been a very successful tool. Here are some if what you want to do is developer outreach.

  9. Web App Mistakes: Condemned to repeat

    Mike Davies' great article about mistakes in web app design.

  10. 50 performance tricks to make your HTML5 apps and sites faster

    A video keynote from Microsoft's build event with lots of information on how browsers work and how you can make them slow without wanting to.

  11. Scrubby

    Grab a literal in the code and drag left-to-right to update the value in real-time.

  12. JS Dares

    A site to learn JavaScript by creating simple robot programs or altering existing code. Much like Mozilla Thimble

  13. Five smartphone features you never thought using

    Splendid article by .net magazine on thinking outside the box with smartphone apps. Use those sensors. Related: check the web API work.

    You can also see it in action here.

  14. Use Cases and Requirements for Standardizing Responsive Images

    Use Cases and Requirements for Standardizing Responsive Images

  15. A comparison of JavaScript physics engines

    Including tips on how to use them in the most performant way

  16. WebRTC hits Firefox Android and iOS

    WebRTC will be the big thing in the coming year. From Webcam access to peer to peer connectivity.

    You can also see it in action here.

  17. Flora.js

    Natural systems simulation made easy

  18. Icomoon

    Icomoon allows you to create your own icon web fonts by taking icons from existing fonts or uploading SVG files.

  19. Conditional loading of resources with mediaqueries

    Mediaqueries allow us to change the look and feel of an HTML document according to attributes of the browser size and other properties of the displaying hardware. There is however an issue with resources being loaded that do not need to be. Using matchmedia in JavaScript you can not only display things differently but you can also also load resources only when they make sense.

  20. Restclient

    Restclient is a debugging tool for RESTful APIs. In case you do not get the data back you expect try this tool to see if it is your code or the API that has a flaw

  21. is a service to show massive images with a scroll and zoom interface much like google maps. Check the Garden of earthly delights as a demo.

    You can also see it in action here.

  22. Photobooth.js

    Photobooth.js is a jQuery plugin using getUserMedia allowing you to take a photo with your webcam and crop and change colours. Very handy for taking a quick photo.

  23. The Web we lost

    Very thoughtful article by Anil Dash about the great ideas and concepts of the early social web that got lost in the new world of instant updates and walled gardens. In the follow up - the demo link - Anil shows how we could fix some of those issues.

    You can also see it in action here.

  24. The power of introverts

    Today we end this calendar with a video of a talk. This talk by Susan Cain explains that our culture values extroverted people and sees introverts as holding us back and how this is changing. It is a great reminder that we are all different and in order to work together we need to listen to everybody. So go out and make yourself heard with your actions and do not just follow the one who shouts the loudest.

  25. You are not your code

    A short but to the point post by the inventor of prototype that code is not forever and might get outdated and how to deal with code criticism.