Popular Demos And Their Functions

Documentation and coding are the two factors that MochiKit is currently focused upon for development. Obviously, there are a number of different tutorials and examples which we plan on adding in future, but the following ones are the basic demos which will help you get started with MochiKit. To learn more, check the following link:  https://mochi.github.io/mochikit/examples/effects/index.html

  • Interpreter
  • Draggable
  • Key Events
  • Logging Pane
  • View Source
  • MochiRegExp
  • AJAX Tables
  • Sortable Tables Rounded Corners
  • Visual Effects
  • Color Wheel


This interactive JavaScript Interpreter demo makes use of MochiKit.DOM developed by MochiKit for manipulating the display. All you need to do is to type any code into text input, then press “enter” and the result will be shown to you. JavaScript also leverages MochiKit.Async Deffereds through blockOn.

  • You need to type help(fn)on MochiKit function to show signature of MochiKit function as well as link to the documentation.
  • Press ctrl + enter or cmd + enter after writing multi-lined code snippets on lower text section to submit the text
  • The up and down arrows work as rudimentary history
  • To clear interpreter window, use the command clear ( )

Visual Effects

Among the visual combination effects, the demos are Visual.appear, Visual.fade, Visual.puff, Visual.blindDown, Visual.blindUp, Visual.switchOff, Visual.sideDown, Visual.slideUp, Visual.dropOut, Visual.shake, Visual.pulsate, Visual.squish, Visual.fold, Visual.grow, Visual.shrink and Visual.Highlight. Other samples include effects like Onload, Big slide, Shrink/Grow, Queue, Appear and fade. You can review the effect and also reset them according to your requirement.

Color Wheel

As the name suggests, Color Wheel helps in creating animated visualizations offered by CSS3 colors according to hue (angle), luminance (time/alpha) and saturation (distance). It makes use of other demos of MochiKit like MochiKit.Color, MochiKit.Async and MochiKit.DOM. Some of the colors thus offered are Blue, Violet, Red, Medium Violet, Steel Grey, Plum, Deep Pink, Black, Magenta etc.