Back to

Examples of basic web controls

We use these controls to develop interactive simulations of physical systems for active learning. We use client-side technology (html, css, javascript) with no, or few, external libraries.

When the user makes a change to a control, a javascript function is called in order to carry out actions.

Examples of individual controls are shown here so they are easier to inspect than those embedded in a complete simulation. See source files of these examples by viewing the page source in your browser, or at

See source files of complete simulations at See our main site at

First, an example of a minimal .html text file to run Javascript in your web browser. All you need in the .html file is a script tag with your Javascript, using document.write() to write html to the web page or console.log() to write to the browser's Javascript console:

        let a = 2;
        console.log('minimal JS example, a = ' + a); // view in browser's Javascript console
        let b = Math.pow(a,2); // raise a to power of 2
        document.write('hello'); // display output on web page
        document.write('<br> b = ' + b); // note <br> to start new line

Basic Examples