THT DUYURU

chat
takipci
chat
Seçenekler

Checkbox Highlighter (ing)

ZeRooCooL - ait Kullanıcı Resmi (Avatar)
Üye
Üyelik tarihi:
01/2012
Mesajlar:
2.629
Konular:
1273
Teşekkür (Etti):
210
Teşekkür (Aldı):
304
Ticaret:
(0) %
0
1026
29-03-2012 19:43
#1
Checkbox Highlighter (ing)
Form kutucukları işaretlendiğinde tablo hücrelerinin arkaplan renginin değişmesini de sağlıyor.

Kod:
<html>
<head>
<title>Table Row Highlighter</title>
<script type="text/javascript">

/* JavaScripts http://javascripts.com
Created by: Gil Davis | ayse incebulut */
function check(it) {
  tr = it.parentNode.parentNode;
  tr.style.backgroundColor = (it.checked) ? "gold" : "white";
}
</script>

<style type="text/css">
<!--
tr.row {
  color: #cc3333;
  background-color: white;
}

td.col {
  border: 1px solid blue;
  padding: 5px;
}

table.test {
  text-align: center;
  width: 340px;
  margin-left: 10%
}
-->
</style>

</head>
<body>

<form onsubmit="return false">
<table class="test">
<tr class="row"><td class="col"><input type="checkbox" onclick="check(this)"></td><td class="col"><a href="http://javascripts.com">JavaScripts.com</a></td><td class="col"><a href="http://javascripts.com">JavaScripts.com</a></td></tr>
<tr class="row"><td class="col"><input type="checkbox" onclick="check(this)"></td><td class="col"><a href="http://javascripts.com">JavaScripts.com</a></td><td class="col"><a href="http://javascripts.com">JavaScripts.com</a></td></tr>
<tr class="row"><td class="col"><input type="checkbox" onclick="check(this)"></td><td class="col"><a href="http://javascripts.com">JavaScripts.com</a></td><td class="col"><a href="http://javascripts.com">JavaScripts.com</a></td></tr>
<tr class="row"><td class="col"><input type="checkbox" onclick="check(this)"></td><td class="col"><a href="http://javascripts.com">JavaScripts.com</a></td><td class="col"><a href="http://javascripts.com">JavaScripts.com</a></td></tr>
</table>
</form>

</body>
</html>

Bookmarks


« Önceki Konu | Sonraki Konu »
Seçenekler