I am trying to use java or jquery to create an image that fades from one picture to another when a website user turns up a dial I create on the page.
The image below shows basically what it will look like. The dial starts on "dark", which displays a picture of an unlit piece of stone. As the user starts to move the dial towards "bright", the image fades into a picture of a backlit piece of the same stone, giving off the impression the stone is slowly being lit up.
Is there a way to do this with java or do I need to use flash?
Back to the issue at hand though - you can use CSS to place a second image over the top of the first one, and then adjust its opacity from 0 up to full.