Как ще стане тоя номер??

trevata

Registered
http://wufoo.com/gallery/templates/registrations/workshop-registration/
Вижте като цъкнете във някое поле, как става жълто.... Как става тоя номер ? :roll:
 
Всичко се вкарва в голям див, на който при onclick се задава background-color, ако не можеш да си го напишеш, кажи да ти го драсна набързо :)
 
<html>
<head>
<script language="JavaScript">
function jalt() {
var div = document.getElementById('jalt');
div.style.background='yellow'; }
function normal() {
var div = document.getElementById('jalt');
div.style.background='white'; }
</script>
</head>
<body>
<div id="jalt" style="background: white;" onClick="javascript:jalt()" onMouseOut="javascript:normal()">
Text
</div>
</body>
</html>
Друго не можах да измисля...
 
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
<script type="text/javascript"> 
var normalcolor = '#000000'; // Посочваш цвета, който ще бъде когато не е селектнат
var hovercolor = '#b90000'; // Посочваш цвета, който ще бъде когато е селектнат
function bkdiv(divid) {
	var divid = document.getElementById(divid);
	divid.style.background = hovercolor
}
function unbk(divid) {
	var divid = document.getElementById(divid);
	divid.style.background = normalcolor
}
</script>
<body>
<center>
<div id="id1" style="background-color: #000000;" onmouseover="bkdiv('id1')" onmouseout="unbk('id1')">
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
</div>
<br /><br />
<div id="id2" style="background-color: #000000;" onmouseover="bkdiv('id2')" onmouseout="unbk('id2')">
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
</div>
</center>
</body>
</html>
демо: http://scriptx.info/dmz/background-inputs.html

едит: малко го оптимизаирах :)
 
devent мерси аз го направих със onClick, я кажи са как да го направа като цъкне другаде тогава да се маха баш като на оня линк :oops:
 
trevata каза:
devent мерси аз го направих със onClick, я кажи са как да го направа като цъкне другаде тогава да се маха баш като на оня линк :oops:
:)
Направи го със :focus върхо дива.. :)
Така като дадеш на дива ще ти излиза и като махнеш се маха същото като в оня сайт. :)
само че ie .. sux
 
И аз не харесвам да има 101001 реда код, но 70% от потребителите няма да виждат ефекта(ако не са и повече) заради ИЕ-то :)
 
Там е с js, @dashe имаше предвид да се сложи ховър на дива и затова написах поста за IE, по-късно ще потърся някакъв начин да го оправя това :)
 
<script type="text/javascript">
function bgcolor(type){
if(type == "on"){
document.getElementById('tab').style.backgroundColor='red';
document.getElementById('tab').onclick = new Function('javascript: bgcolor("off");');
}
if(type == "off"){
document.getElementById('tab').style.backgroundColor='green';
document.getElementById('tab').onclick = new Function('javascript: bgcolor("on");');
}

}
</script>
<table border="1" width="500px" height="500px" >
<tr>
<td>aaaaaaaaaaaa</td>
<td id="tab" onclick="javascript: bgcolor('on');"> bbbbbbbbbbbbbbb</td>
</tr>
</table>
 
Ето с онклик, това е единственото, което ми хрумна
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
<script type="text/javascript"> 
var normalcolor = '#e6ffe6'; // Посочваш цвета, който ще бъде когато не е селектнат
var hovercolor = '#ceebce'; // Посочваш цвета, който ще бъде когато е селектнат
function bkdiv(divid,divid2,divid3) {
	var divid = document.getElementById(divid);
	var divid2 = document.getElementById(divid2);
	var divid3 = document.getElementById(divid3);
	divid.style.background = hovercolor
	divid2.style.background = normalcolor
	divid3.style.background = normalcolor
}
</script>
<body>
<center>
<div id="id1" style="background-color: #e6ffe6;" onclick="bkdiv('id1','id2','id3')">
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
</div>
<br /><br />
<div id="id2" style="background-color: #e6ffe6;" onclick="bkdiv('id2','id1','id3')">
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
</div>
<br /><br />
<div id="id3" style="background-color: #e6ffe6;" onclick="bkdiv('id3','id1','id2')">
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
<input type="text" name="name" /><br />
</div>
</center>
</body>
</html>
демо -> http://scriptx.info/dmz/background-inputs2.html
 
Измислих го, ето моя код преправен:
<html>
<head>
<script language="JavaScript">
function jalt() {
var div = document.getElementById(div);
div.style.background='yellow'; }
function normal(id) {
var div = document.getElementById(div);
div.style.background='white'; }
</script>
</head>
<body>
<div id="div" style="background: white;" onClick="javascript:jalt()">
Text
</div>
<div id="div2" style="width: 100%; height: 100%;" onClick="javascript:normal()">
</div>
</body>
</html>

Правят се 2 или повече div-а и ако се цъкне в единия той се оцветява, ако се цъкне в някой от другите вече не е оцветен ;)
 

Back
Горе