Как добавить подсветку таблицы в PHP? - PullRequest
Новая
       3

Как добавить подсветку таблицы в PHP?

1 голос
/ 29 апреля 2011

HI.Я хочу знать, как добавлять подсветку строк таблицы каждый раз, когда пользователь наводит курсор мыши.Я был в состоянии успешно чередовать цвет строки.Я новичок в веб-программировании и очень мало знаю javascript.Пожалуйста, помогите мне с этим.

Вот коды:

display.php : 

<table class="table_data">
 <tr>
  <th><nobr>ID</nobr></th>
  <th><nobr>First Names</nobr></th>
  <th><nobr>Gender</nobr></th>
 </tr>

 <?php 
  $row_ctr = 1;

  while ($first_names_array = mysql_fetch_array($first_names)) {
   if (($row_ctr % 2) == 0) $alternate = "even";
   else $alternate = "odd";

   echo "<tr>";
   echo "<td class='$alternate'><nobr>"  .  $first_names_array['id'] . "</nobr></td>";
   echo "<td class='$alternate'><nobr>" . $first_names_array['first_name'] . "</nobr></td>";
   echo "<td class='$alternate'><nobr>" . $first_names_array['gender'] . "</nobr></td>";
   echo "</tr>";

   $row_ctr += 1;
  }
 ?>

 </tr>
</table>

и в моем css:

style.css 

.odd {
 background-color: #525252;
}

.even {
 background-color: #B7ACC6;
}

.highlight {
  background-color: #FF0;
}

Я понятия не имею, как это сделать, но, как я уже сказал, чередование цветов строкиза работой.Это просто основной момент, с которым у меня проблемы.Я абсолютный новичок, как я уже говорил ранее.Просьба помочь ..

Ответы [ 4 ]

3 голосов
/ 29 апреля 2011

Вам не нужен php или javascript.

Вы можете сделать это css: 

.table_data tr:hover{background-color:#000000;} /*highlight with black background*/
1 голос
/ 29 апреля 2011

Чтобы добавить поддержку IE, вы можете использовать jQuery: 

$(document).ready(function(){
    $(".table tr").mouseenter(function(){
        $(this).addClass("hover");
    }).mouseleave(function(){
        $(this).removeClass("hover");
    };
});

Затем вы используете что-то вроде этого в вашем CSS: 

.data_table tr.hover td
{background: #ccc;}
1 голос
/ 29 апреля 2011

Используйте для вас класс tr и следующие свойства 

 echo "<tr class='highlightrow'>";
   echo "<td class='$alternate'><nobr>"  .  $first_names_array['id'] . "</nobr></td>";
   echo "<td class='$alternate'><nobr>" . $first_names_array['first_name'] . "</nobr></td>";
   echo "<td class='$alternate'><nobr>" . $first_names_array['gender'] . "</nobr></td>";
   echo "</tr>";

и css для .highlightrow 

.highlightrow:hover td
{
  background-color: Black;
  color: white;
  cursor: pointer;
}
0 голосов
/ 05 февраля 2012

void чрезмерный код для стиля, сделайте это с помощью css

используйте следующее с td или tr или таблицей: 

onmouseover="style.backgroundColor='#colorcode'

onmouseout="style.backgroundColor='#colorcode'

 - and for alternating table also use css

tr:nth-child(even) {background: #colorcode}
tr:nth-child(odd) {background: #colorcode}
...