Поменять bg в зависимости от контента.
Здрасвуйте, помогите пожалуйста реализовать следующую конструкцию.
у меня с синтаксисом джавы все очень плохо. Есть обычный тэйбл, надо прочитать содержимое td и в зависимости от четного или нечетного числа присвоить разные цвета, а именно hover т.е. чтобы при наведение цвет менялся, а после того как мышь убирается, цвет угасает. К примеру желтый к четным, и коричневый к нечетным. Там внизу я стырил функцию которая занимается просчетом, а вот прикрутить никак не могу...
<table class="table">
<caption>Test task</caption>
<tbody>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>6</td>
<td>7</td>
</tr>
</tbody>
</table>
<!-- Second task end -->
<!-- third task start-->
<script>
function isPrimeNumber(num) {
if (num % 2 == 0) {
return 'True'
}
return 'False';
}
document.write(isPrimeNumber(2));
document.write('<br>');
document.write(isPrimeNumber(5));
</script>
|
ну вот к примеру скрипт, добаить туда условие: если содержимое td четное $(this).css("background-color", "yellow");
иначе $(this).css("background-color", "green");
<script>
$("td").hover(function(){
$(this).css("background-color", "yellow");
}, function(){
$(this).css("background-color", "white");
});
</script>
|
AndyTitan,
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<table class="table">
<caption>Test task</caption>
<tbody>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>6</td>
<td>7</td>
</tr>
</tbody>
</table>
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script>
$('.table').on({
'mouseenter': function () {
var num = $(this).text();
$(this).css({
backgroundColor: (num % 2 == 0) ? 'yellow' : 'brown',
});
},
'mouseleave': function () {
$(this).css({
backgroundColor: '',
});
}
}, 'td');
</script>
</body>
</html>
|
Спасибо вам огромное.
|
| Часовой пояс GMT +3, время: 05:58. |