SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Mar 2013
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Able to create a dial that allows user to control a fade from one image to another?

    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?

    dial-brighttodark.jpg

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,716
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by denver84 View Post
    Is there a way to do this with java or do I need to use flash?
    With Java there may be a way, but we don't deal with Java here. That's an applet-based language that is used to do very different things from JavaScript. The languages don't cross over either. The only similarity between them is that they both start with the same letters. They're like car and carpet.

    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.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •