Ok - so far i got it to work. The reason why the things didnt
work was because the functions weren´t loaded on (document).ready.
One solved next problem comes....... i want it that way, once next
button in row is activated the previous shouldnt work any more until
the next one is deactivated.
tried it with unbind - that works but when i rebind the original
function it shows some really strange behaviour.... like working
only on second click then flickering and goes to desired state.
Can anyone give me please a hint how to proceed?
Is it possible to make these functions a little more generic?
Thanks for help!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://
www.w3.org/TR/html4/loose.dtd">
<html>
<head>
</head>
<body>
<script type="text/javascript" src="jquery/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#desperation input[type=image]').attr('disabled', true).fadeTo
("fast", 0.10);
$('#1').attr('disabled', false).fadeTo("fast", 0.40);
$("#1").toggle(
function () {
$("#2").attr("disabled", false).fadeTo("fast", 0.50);
$("#1").val("underdog").fadeTo("slow", 1.00);;
},
function () {
$("#2").attr("disabled", true).fadeTo("slow", 0.10);
$("#1").val("").fadeTo("slow", 0.50);
}
);
$("#2").toggle(
function () {
$("#3").attr("disabled", false).fadeTo("fast", 0.50);
$("#2").val("dump_guns").fadeTo("slow", 1.00);
},
function () {
$("#3").attr("disabled", true).fadeTo("slow", 0.10);
$("#2").val("").fadeTo("slow", 0.50);
}
);
$("#3").toggle(
function () {
$("#4").attr("disabled", false).fadeTo("fast", 0.50);
$("#3").val("desperation_fire").fadeTo("slow", 1.00);
},
function () {
$("#4").attr("disabled", true).fadeTo("slow", 0.10);
$("#3").val("").fadeTo("slow", 0.50);
}
);
$("#4").toggle(
function () {
$("#5").attr("disabled", false).fadeTo("fast", 0.50);
$("#4").val("rum_ration").fadeTo("slow", 1.00);
},
function () {
$("#5").attr("disabled", true).fadeTo("slow", 0.10);
$("#4").val("").fadeTo("slow", 0.50);
}
);
$("#5").toggle(
function () {
$("#5").val("hasty_fire").fadeTo("slow", 1.00);
},
function () {
$("#5").val("").fadeTo("slow", 0.50);
}
);
});
</script>
<div id="skill">
<form action="javascript:void(null);" method="post"
enctype="application/x-www-form-urlencoded" id="skillplanner"
name="skillplanner" >
<fieldset id="desperation"><legend>Freetrader Skills: Desperation</
legend>
<input type="image" src="files/icons/underdog.png" id="1"
name="underdog"></input>
<input type="image" src="files/icons/dump_guns.png" id="2"
name="dump_guns"></input>
<input type="image" src="files/icons/desperation_fire.png" id="3"
name="desperation_fire"></input>
<input type="image" src="files/icons/rum_ration.png" id="4"
name="rum_ration"></input>
<input type="image" src="files/icons/hasty_fire.png" id="5"
name="hasty_fire"></input>
</fieldset>
</form>
</div>
</body>
</html>
