İPUCU

Seçenekler

Checkbox Highlighter (ing)

ZeRooCooL - ait Kullanıcı Resmi (Avatar)
Üye
Üyelik tarihi:
01/2012
Mesajlar:
2.627
Konular:
1273
Teşekkür (Etti):
213
Teşekkür (Aldı):
304
Ticaret:
(0) %
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

Yetkileriniz
Sizin Yeni Konu Acma Yetkiniz var yok
You may not post replies
Sizin eklenti yükleme yetkiniz yok
You may not edit your posts

BB code is Açık
Smileler Açık
[IMG] Kodları Açık
HTML-Kodları Kapalı
Trackbacks are Kapalı
Pingbacks are Kapalı
Refbacks are Kapalı