Hallo, wie schaffe ich es, dem Spoiler-Button zu verbreitern, ohne dass die organge Titel-Zeile verspringt? Darin sollte anstatt des "Plus" das Wort "Setlist" stehen und anstatt des "Minus" das Wort "hide".
Ferner sollte die orange Titel-Zeile links und rechtsbündig mit dem darunter
angezeigte Inhalt abschliessen.
Kann mir jemand helfen?
Wäre Super, danke.
Gruß Michael
http://17703662.de.tl/TEST-2.htm
hier der Code:
rot: eigentlicher Code, schwarz, eingefügte Inhalte
<br />
<script type="text/javascript">
function spoil(me) {
if (me.parentNode.parentNode.getElementsByTagName('div')[2].getElementsByTagName('div')[0].style.display != '') {
me.parentNode.parentNode.getElementsByTagName('div')[2].getElementsByTagName('div')[0].style.display = '';
me.value = '-'+me.value.substr(1);
} else {
me.parentNode.parentNode.getElementsByTagName('div')[2].getElementsByTagName('div')[0].style.display = 'none';
me.value = '+'+me.value.substr(1);
}
}
</script>
<div style="margin-left: 30px;">
<div style="height: 20px; float: left;"><input type="button" value="+" onClick="spoil(this);" style="height: 20px; min-width: 20px; font-size: 10px; margin: 0pt; padding: 0pt;" name="button" /></div>
<div style="background-color: orange; text-align: left; height: 20px; font-weight: bold; margin-left: 25px;">Titel</div>
<div><br />
<div style="display: none; margin-left: 25px;">
<table width="932" border="1" align="left" style="table-layout: fixed;">
<colgroup><col width="140" /></colgroup><colgroup><col width="20" /></colgroup><colgroup><col width="26" /></colgroup><colgroup><col width="285" /></colgroup><colgroup><col width="50" /></colgroup><colgroup><col width="50" /></colgroup><colgroup><col width="26" /></colgroup><colgroup><col width="285" /></colgroup><colgroup><col width="50" /></colgroup>
<tbody>
<tr>
<td valign="bottom" bgcolor="#ff9933" align="center" rowspan="2"><span style="font-family: Verdana;"> <br />
</span></td>
<td valign="middle" align="center"><span style="font-family: Verdana;"><a name="Leeds_1973-10-19"></a></span></td>
<td valign="middle" align="center"><span style="font-family: Verdana;"> </span></td>
<td valign="middle" align="center"><span style="font-family: Verdana;"> </span></td>
<td valign="middle" align="center"><span style="font-family: Verdana;"> </span></td>
<td valign="middle" align="center"><span style="font-family: Verdana;"> </span></td>
<td valign="middle" align="center"><span style="font-family: Verdana;"> </span></td>
<td valign="middle" align="center"><span style="font-family: Verdana;"> </span></td>
<td valign="middle" align="center"><span style="font-family: Verdana;"> </span></td>
</tr>
<tr>
<td><span style="font-family: Verdana;"> </span></td>
<td valign="middle" bgcolor="#ccccc0" align="center"><span style="font-family: Verdana;"><span style="font-size: small;">CD1</span></span></td>
<td valign="top" align="left"><span style="font-family: Verdana;"> </span></td>
<td><span style="font-family: Verdana;"> </span></td>
<td valign="top" align="center"><span style="font-family: Verdana;"> </span></td>
<td valign="top" align="center"><span style="font-family: Verdana;"> </span></td>
<td valign="top" align="center"><span style="font-family: Verdana;"> </span></td>
<td valign="top" align="left"><span style="font-family: Verdana;"> </span></td>
</tr>
<tr>
<td valign="middle" align="center"><span style="font-family: Verdana;"><img height="138" width="138" alt="" src="http://img.webme.com/pic/p/pink-camel/ne.jpg" /></span></td>
<td rowspan="7"><span style="font-family: Verdana;"> <br />
<br />
<br />
<br />
<br />
<br />
</span></td>
<td valign="top" align="left" rowspan="7"><span style="font-family: Verdana;"><span style="font-size: small;">01.<br />
02.<br />
03.<br />
04.<br />
05.<br />
06.<br />
<br />
</span></span></td>
<td valign="top" align="left" rowspan="7"><span style="font-family: Verdana;"><span style="font-size: small;">Earthrise<br />
The Procession > The White Rider<br />
Six Ate <br />
Supertwister<br />
Lady Fantasy<br />
Arubaluba<br />
<br />
<br />
<br />
</span></span></td>
<td valign="top" align="center" rowspan="7"><span style="font-family: Verdana;"><span style="font-size: small;"><span style="color: rgb(255, 0, 0);"><font color="#000000"><span style="color: rgb(255, 0, 0);"><span style="color: rgb(255, 0, 0);"><font color="#000000"><font color="#000000"><font color="#000000">07:11<br />
08:30<br />
06:08<br />
03:30<br />
13:56<br />
06:27<br />
<br />
<strong>45:42</strong></font></font></font></span></span></font></span><br />
<br />
<br />
<br />
<br />
<br />
</span></span></td>
<td valign="top" align="center" rowspan="7"><span style="font-family: Verdana;"> <br />
<br />
<br />
<br />
<br />
<br />
</span></td>
<td valign="top" align="left" rowspan="7"><span style="font-family: Verdana;"> </span></td>
<td valign="top" align="left" rowspan="7"><span style="font-family: Verdana;"> <br />
<br />
<br />
<br />
<br />
</span></td>
<td valign="top" align="center" rowspan="7"><span style="font-family: Verdana;"><br />
<br />
<br />
<br />
<br />
<br />
</span></td>
</tr>
<tr>
<td valign="top" bgcolor="#ff9933" align="center" rowspan="6"><span style="font-family: Verdana;"><span style="font-size: small;"><strong>Leeds</strong>, GB<br />
Queen´s Hall<br />
<br />
1973-10-19<br />
<br />
Source: AUD<br />
Quality: C <br />
</span></span></td>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
</tbody>
</table>
<script type="text/javascript">
function spoiler_on(me) {
if (me.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != 'block') {
me.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'block';
me.innerText = '';
me.value = 'Hide';
} else {
me.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';
me.value = 'Show'; }}
function spoiler_off(me) {
me.parentNode.style.display = 'none';
me.parentNode.parentNode.parentNode.getElementsByTagName('div')[0].getElementsByTagName('input')[0].value = 'Show'; }
</script></div>
</div>
</div>
<br />
<br />[color=red][/color]