www.webdeveloper.com
Results 1 to 6 of 6

Thread: onClick pixel color change

Hybrid View

  1. #1
    Join Date
    Apr 2010
    Posts
    12

    Question onClick pixel color change

    A lot information about changing background color/image , font color, row color etc. but I can't find a clue how to change, on mouse click, one or a few pixels (at the clicking spot) to a different color.
    Plz help if you can

  2. #2
    Join Date
    Dec 2005
    Posts
    2,984
    Be creative, imaginative...think about it! Pixels on a webpage cannot change color, but elements can. So wherever the mouse is clicked, it sounds like you want to create an element (e.g. div, span, img, whatever) that is a 1x1 or 2x2 or 3x3, or whatever size you want it.

    So what you need to look for when searching is:
    1) How to get the position of a mouse click on the screen
    2) How to create and append an HTML element to your document using Javascript
    3) How to use CSS to position the element created in #2 where you want it.

  3. #3
    Join Date
    Apr 2010
    Posts
    12
    Yep, this would be easy. What I want, is several users to click on an element, and each click to be graphically represented as a few surrounding pixels changing colors. And I want to see the effects in real-time.

  4. #4
    Join Date
    Nov 2003
    Location
    Worthington, OH, USA
    Posts
    3,634
    Using a transparent pixel, change the background color onclick. Since the pixel is transparent the background color will display through. Real trick is painting the entire screen with pixels.
    54 68 65 42 65 61 72 4D 61 79

  5. #5
    Join Date
    Apr 2010
    Posts
    12
    Is it possible for different users from the web to click on one specific area on the page, seeing the effects of their own clicks and the clicks of others 'live' with no delay (except of course the ping) ? I mean, it must be, but will javascript do ?

  6. #6
    Join Date
    Dec 2005
    Posts
    2,984
    Rather than pushing data from the server, which could be quite intensive depending on how popular the site is, I'd use AJAX called using a setTimeout from when the page loads. Every time the AJAX request is complete, get it to update the image. If you want it to appear 'live', set the timeout to run every second or so.

    Javascript, by itself, won't do - you'll need a server-side script and a database or some sort to store the clicks of users.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles