ProfiPHPProfiPHP
Категория: jQuery

Изменение цвета блока при нажатии на него

Если вам необходимо изменить цвет блока на нажатии на него, реализовать это можно очень просто с помощью библиотеки jQuery.

Обязательно перед использованием необходимо подключить библиотеку jQuery.

Добавляем следующий JS код:
<script type="text/javascript">
jQuery(function( $ ) {
$('.answers li.wrong').click(function(){
$(this).addClass('wrong_answer');
});
$('.answers li.right').click(function(){
$(this).addClass('right_answer');
});
});
</script>
Код CSS:
<style type="text/css">
.answers li.right_answer{ border: 1px solid #6cdb9b; background: #6cdb9b; color: #fff }
.answers li.wrong_answer{ border: 1px solid #e4615d; background: #e4615d; color: #fff }
</style>
Код HTML:
<ul class="answers">
<li class="wrong">Не правильно</li>
<li class="right">Правильно</li>
</ul>
С помощью данного кода можно реализовать на сайте систему тестов.

Добавить комментарий

Имя:
Текст комментария: