"Thrane" <kyskoen@stofanet.dk> writes:
> "Henrik Stidsen" <henrikstidsen@gmail.com> wrote in message
> news:1163677631.504307.98030@f16g2000cwb.googlegroups.com...
>
>>Kan du ikke bare lave en række billeder og så kode radiobutton
>>funktionaliteten selv ? Det er ikke særlig kompliceret, kræver blot
>>du holder styr på hvilken knap der er valgt.
>
> Jeg har desværre ingen færdigheder i den retning...
Så er det farligt at gøre det. Selvom du finder verdens bedste script
til at gøre det du vil, så er der garanteret et eller andet der skal
tilpasses. Hvis du ikke kan gøre det selv, så skal du overveje om det
er pengene værd at betale for det, eller risikoen værd at løbe an på
folks venlighed i længden.
Eller, kortere: Slå ikke større brød op end du selv kan vedligeholde
:)
Hvis du alligevel vover fjerene:
<script type="text/javascript">
function imageRadioButtons(imgOn, imgOff, radiobuttons) {
var grpName = radiobuttons[0].name;
var idPrefix = "__" + grpName + "_";
var form = radiobuttons[0].form;
var field = document.createElement("input");
field.type = "hidden";
field.name = grpName;
var checked = -1;
var values = [];
for(var i = 0; i < radiobuttons.length; i++) {
var radiobutton = radiobuttons[i];
if (radiobutton.checked) { checked = i; }
values[i] = radiobutton.value;
var img = new Image();
img.src = radiobutton.checked ? imgOn : imgOff;
img.id = idPrefix + i;
img.onclick = (function(i){return function() {
if (checked != i) {
if (checked >= 0) { // uncheck old
document.images[idPrefix + checked].src = imgOff;
}
this.src = imgOn;
field.value = values[i];
checked = i;
}
};})(i);
radiobutton.parentNode.insertAfterBefore(img,radiobutton);
}
for(i = radiobuttons.length - 1; i >= 0; i--) {
radiobutton = radiobuttons[i];
radiobutton.parentNode.removeChild(radiobutton);
}
form.appendChild(field);
}
</script>
med eksempel:
<script type="text/javascript">
window.onload = function() {
var elems = document.forms['formId'].elements;
imageRadioButtons("PicA.png", "PicB.png", elems['radiogrp']);
}
</script>
<form id="formId" action="" method="get">
<input type="text" name="text" value="lala">
<input type="radio" name="radiogrp" value="appelsin">
<input type="radio" name="radiogrp" value="æble" checked="checked">
<input type="radio" name="radiogrp" value="racerbil">
<input type="submit" value="prøv!">
</form>
Her er der forsøgt at undgå at siden bliver afhængig af Javascript.
(Og så har vi slet ikke nævnt usability-problemet med at bruge noget
der ikke ligner radioknapper som radioknapper, når der nu er nogle
fortræffelige indbyggede radioknapper med et udseende som brugeren
allerede er vant til.)
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:
http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'