Build a Mousewheel with Arduino and JavaScript


i have never done anything with arduino, but I have an issue with a project and i think i can solve it with Arduino.

I build a Turn/Push-Button with the Hardware of a Computermouse. I need the Button to navigate in a digital Signage System, here you can see a mockup of the button:

unfortunately the button isn't really solid, so i need a better solution than the Hardware of a mouse. Is it possible to build something like a mousewheel with arduino (im quite sure it is) and if - is it difficult? I need to process the Signals from the Arduino in JavaScript, because the System which should be controlled is like a website with html, css and javascript. But i guess there are some "Arduino to Javascript" libraries...Were should i get started?

thanks for help!

So you wanna do something like this?

A rotary encoder is easily decoded with an Arduino (, the connection to javascript can be done via several ways, depending on your environment, the easiest is a direct connection to the server hosting the web page, another that addition of an Ethernet shield and also possible: providing some JSON of the WiFi shield.

You seem to have several different questions muddled together.

If you want your Arduino to detect rotational movement but not absolute position, you can use a rotary encoder. These can be set up to behave similar to a mouse wheel - you can tell when they have been turned and in which direction and how far, but they don't have any absolute position indication. Obviously there are numerous sources for momentary switches. You can even get rotary knobs with an integral pushbutton so that you push the knob to operate the button and turn it to operate the encoder. This seems like the sort of thing you need.

hi and thanks for the replys! as you can see in the picture from my first post i already use a rotary encoder from a mouse (this thing named "mousewheel"). But this litte thing from the mouse is way to fragile for my needs. I'm afraid the little rotary encoder from the site which pylon posted isn't solid enough as well. So i thought i can build a Rotary Encoder by myself which is very solid - and thats my question here :) I need a rock-solid one, because its a big button (like a "buzzer") which is in heavy use... "rotary encoder" is a good keyword, i'll do some research now! thanks!

Doing one yourself is possible. What resolution do you need? What size should or could it be?

You can build a rotatory encoder from an old hard drive motor.

or an old stepper motor.

serio: But this litte thing from the mouse is way to fragile for my needs.

Too fragile in what respect? If it's for industrial use, you should design your control so that users can't apply forces directly to the sensors. Assuming you use robust buttons/knobs mounted securely to a suitable enclosure, and assuming you arrange for the enclosure to be suitably sealed and mounted, I don't see why there should be any special requirements to ruggedize the sensors. If there is, you could take the optics from a mechanical mouse and make your own encoder disk, or make the whole thing from scratch using a home-made encoder disk and a couple of switches or optical sensors.