PDA

View Full Version : Changing Table background color on click



element13
Jul 29th, 2010, 03:17 AM
So I'm making this calendar where a user can select a day and it will show available timeslots on that day. So first I have a basic calendar showing the month and which days are available, so when they mouseover it will change the background to red if it's not a valid choice (any day in the past) and green if it is, and then back to the default color when the mouse is no longer over (light red for days in the past, light green for current day, and light blue for future). Now, I want the cell to stay green if they click it. How do I do that so it won't change back to the default color onmouseout?

The HTML is all being generated by PHP, we pull the server date/time to decide what days are valid. Here is the basic output for the cell that is today:

<TD class="today" onmouseover="style.backgroundColor='#00FF00';" onmouseout= "style.backgroundColor='#99CC99'">28</TD>

tjoyce0909
Aug 3rd, 2010, 07:59 PM
<TD class="today" onmouseover="style.backgroundColor='#00FF00';" onmouseout= "style.backgroundColor='#99CC99'" onclick="this.style.backgroundColor='green'">28</TD>


although, this is intrusive javascript and not necessarily the most condoned approach, it should work. Change the word 'green' to the hex code for the green color that you want.