adding line-through style to a table row

[Andrus]

I want that if user clicks in a checkbox, the strike-through effect applices
to current table row. I tried the following code in IE, but nothing happens.

Any idea ?

<table>
<tr><td><input type=checkbox onclick="cbonclick(this)"></td>
<td><input type=text value="Row 1" ></td>
<td><select><option>pine</option><option>orange</option></select></td></tr>

<tr><td><input type=checkbox onclick="cbonclick(this)"></td>
<td><input type=text value="Row 2"></td>
<td><select><option>apple</option><option>kiwi</option></select></td></tr>
</table>

<script>
function cbonclick(othis) {
othis.parentNode.parentNode.style.textDecoration=
othis.checked? 'line-through':'';
}
</script>

 

[Lasse Reichstein Nielsen]

I want that if user clicks in a checkbox, the strike-through effect applices
to current table row. I tried the following code in IE, but nothing happens.

You can't make strike-through (or any other text decoration) affect
input or select elements.

<input type="text" value="test" style="text-decoration:strike-through">
gives normal text in the textbox.

/L

 

[DU]

You can't make strike-through (or any other text decoration) affect
input or select elements.

line-through works in select (at least options in select) in NS 7.x,
Mozilla-based browsers. One could also simply change the color from
black to silver for input type="text" and options and then make the
input and select disabled=true.

<input type="text" value="test" style="text-decoration:strike-through">
gives normal text in the textbox.

/L

CSS2 is line-through, not strike-through.

DU

 

[Lasse Reichstein Nielsen]

line-through works in select (at least options in select) in NS 7.x,
Mozilla-based browsers.

It appears it works in IE6 too. I was checking in Opera 7, where it
doesn't.
Ofcourse, saying anything about input elements in general is dangerous,
since there is no standard that defines how they look.

CSS2 is line-through, not strike-through.

Doh. That's what I meant, ofcourse.
/L

 

[Andrus Moor]

It appears it works in IE6 too. I was checking in Opera 7, where it
doesn't.
Ofcourse, saying anything about input elements in general is dangerous,
since there is no standard that defines how they look.

The code below following code shows line-through effect in IE 6

I have a table whose rows contain

<input type=text>, <input type=checkbox>, <span> <select> and <textarea>
elements cells.

Which is the best way to change cbonclick() so that it applies this effect
to all elements in table row ?



<table>
<tr><td><input type=checkbox onclick="cbonclick(this)"></td>
<td><input type=text value="Row 1" ></td>
<td><select><option>pine</option><option>orange</option></select></td></tr>

</td>

<td><select style="text-decoration:line-through"><option>apple</option>
<option>kiwi</option></select></td></tr>
</table>

<script>
function cbonclick(othis) {
othis.parentNode.parentNode.style.textDecoration=
'line-through';
}
</script>

 

[Lasse Reichstein Nielsen]

Well it seems to work as of my Opera7b version, or are my glasses
striken-through ;-) See code below (a bit strange I'll admit, but IMHO
quite adapted to the problematic, especially in regards of the CSS
complex issues involved).

When I test it in O7.20b1, only the text Hello is line-through'ed, not
the input or select elements.

/*@cc_on

What does this fancy comment do? It is something in JScript.NET, right?
Shouldn't it be /*@cc_on */ ?
Uncommenting the next line made no difference in Opera 7.20b1.

elems={td:true, input:true, select:true};

/L

 

[Yep]

(e-mail address removed) (Yep) writes:
When I test it in O7.20b1, only the text Hello is line-through'ed, not
the input or select elements.

Interesting. The version I've been testing on is
Version 7.0
Build 2349
Platform Win32
System Windows 98
and it strikes the INPUT and SELECT elements correctly. If you add
inline style to the form controls, it even strikes twice

What does this fancy comment do? It is something in JScript.NET, right?

Well I don't know for JScript.Net; in (good old) JScript that's
conditional compilation; the point actually is that browser detection
was
(IMHO) required here, given the CSS complex rules and UAs different
behaviors I'd come across (your findings with latest O7 may change the
approach, though).


Regards,
Yep.