Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.94/33: Рейтинг темы: голосов - 33, средняя оценка - 4.94
3 / 3 / 1
Регистрация: 27.03.2010
Сообщений: 57
1

При наведении курсора, ячейка должна окрашиваться в красный цвет, а при клике - в синий

27.03.2010, 22:25. Показов 6901. Ответов 7
Метки нет (Все метки)

При наведении курсора, ячейка должна окрашиваться в красный цвет, а при клике - в синий, но этого не происходит. В чём проблема?

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<html>
<head>
<title>
Paint
</title>
<style>
 td.onmouseover {background-color:red};
 td.onmouseout {background-color:#ffffff;};
 td.onclick {background-color:blue;}
</style>
</head>
 <table width="50%" height="50%" border="3px">
  <tr>
   <td onmouseover="this.className='onmouseover'" onmouseout="this.className='onmouseout'" onclick="this.className='onclick'">1</td>
  </tr>
  <tr>
   <td onmouseover="this.className='onmouseover'" onmouseout="this.className='onmouseout'" onclick="this.className='onclick'">2</td>
  </tr>
  <tr>
   <td onmouseover="this.className='onmouseover'" onmouseout="this.className='onmouseout'" onclick="this.className='onclick'">3</td>
  </tr>
 </table>
</html>
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
27.03.2010, 22:25
Ответы с готовыми решениями:

Почему фон блока смещается при наведении курсора мыши и клике?
Есть div, добавляю ему фон через css. Если div растянут на всю ширину экрана, все нормально. Но...

Как изменить цвет вкладки при наведении курсора?
Здравствуйте! Как изменить цвет вкладки при наведении на нее курсором? Напр. вкладка серого цвета,...

Как изменить цвет Label при наведении курсора?
Есть несколько Label, которым назначен обработчик - загрузить в RichTextBox из файла rtf. Как...

При наведении курсора на строку формы изменить цвет её фона
1)Написать script, в результате работы которого при попадании курсора мыши на элемент списка формы,...

__________________
7
Почетный модератор
11175 / 4131 / 413
Регистрация: 12.06.2008
Сообщений: 11,974
27.03.2010, 23:16 2
В строках
CSS
1
2
 td.onmouseover {background-color:red};
 td.onmouseout {background-color:#ffffff;};
убери в самом конце точки с запятой... что бы было
CSS
1
2
 td.onmouseover {background-color:red}
 td.onmouseout {background-color:#ffffff;}
И таблицу помести внутрь тега <body>
1
3 / 3 / 1
Регистрация: 27.03.2010
Сообщений: 57
28.03.2010, 13:54  [ТС] 3
Цитата Сообщение от Humanoid Посмотреть сообщение
В строках
CSS
1
2
 td.onmouseover {background-color:red};
 td.onmouseout {background-color:#ffffff;};
убери в самом конце точки с запятой... что бы было
CSS
1
2
 td.onmouseover {background-color:red}
 td.onmouseout {background-color:#ffffff;}
И таблицу помести внутрь тега <body>
Спасибо, а как сделать так, чтобы после клика, при выходе курсора из ячейки, ячейка оставалась синей?
0
Почетный модератор
11175 / 4131 / 413
Регистрация: 12.06.2008
Сообщений: 11,974
28.03.2010, 14:02 4
Цитата Сообщение от max-max-max Посмотреть сообщение
а как сделать так, чтобы после клика, при выходе курсора из ячейки, ячейка оставалась синей?
Можно заменить все onclick на
Код
onclick="this.className='onclick';this.onmouseover='';this.onmouseout='';"
1
3 / 3 / 1
Регистрация: 27.03.2010
Сообщений: 57
28.03.2010, 14:08  [ТС] 5
Цитата Сообщение от Humanoid Посмотреть сообщение
Можно заменить все onclick на
Код
onclick="this.className='onclick';this.onmouseover='';this.onmouseout='';"
А чтобы при повторном клике или при клике на другую ячейку, ячейка обратно в белый окрашивалась?
0
Почетный модератор
11175 / 4131 / 413
Регистрация: 12.06.2008
Сообщений: 11,974
28.03.2010, 14:39 6
Код
onclick="if (this.className=='onclick')this.className='';else this.className='onclick';this.onmouseover='';this.onmouseout='';"
Хотя, такое уже проще в отдельную функцию вынести.
1
3 / 3 / 1
Регистрация: 27.03.2010
Сообщений: 57
28.03.2010, 18:45  [ТС] 7
Цитата Сообщение от Humanoid Посмотреть сообщение
Код
onclick="if (this.className=='onclick')this.className='';else this.className='onclick';this.onmouseover='';this.onmouseout='';"
Ну если такую бойду написать, то при клике на другую ячейку, синяя не окрашивается обратно в белый цвет В чём проблема, плизззз, подскажи

HTML5
1
2
3
4
  <td onmouseover="this.className='onmouseover'" 
onmouseout="this.className='onmouseout'" onclick="if 
(this.className=='onclick')this.className='';else 
this.className='onclick';this.onmouseover='';this.onmouseout='';">2</td>
0
2 / 2 / 0
Регистрация: 05.01.2018
Сообщений: 3
11.01.2018, 23:14 8
Для этого нужно использовать псевдоэлементы: :hover (наведение), :active (клик)
HTML5
1
2
3
4
5
6
7
<tr>
   <td class="td">Нужный текст</td>
</tr>
<style>
td.td:hover{background-color:red}
td.td:active{background-color:blue}
</style>
2
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
11.01.2018, 23:14

Заказываю контрольные, курсовые, дипломные работы и диссертации здесь.

Как сделать, что бы цвет текста менялся при наведении курсора???
Как сделать, что бы цвет текста менялся при наведении курсора на какой-нибудь текст в облаке...

Как изменить цвет кнопки при наведении на нее курсора мыши?
Добрый день! Как изменить цвет кнопки при наведении на нее курсора мыши?

Как сделать, чтобы при наведении курсора на Label, он менял цвет?
Доброго времени суток! Как сделать, чтобы при наведении курсора на Label, он менял цвет? Пишу :...

Как сделать, что бы цвет текста в 3D облаке менялся при наведении курсора???
Как сделать, что бы цвет текста в 3D облаке менялся при наведении курсора??? &lt;script...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
8
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.