I've got stuck with a problem in a recent project.
What is to archieve?
A 2x2 table within #content; row 1-line 1 should be able to switch content (different images).
Well, I figured out some code, this should be a simple thing (the code below just shows the principles):
Code: Select all
/* STYLE-definitions (in switch.css, associated with template) */
#nav {position: absolute; margin-top: 210px;}
#one {visibility: visible; position: absolute;}
#two {visibility:hidden; position: absolute; }
#three {visibility:hidden; position: absolute; }
<!-- HTML-Code, put in #content via "edit Source-Code" -->
<table width="100%" valign="top" border="0">
<tr>
<td width="50%" height="250px" valign="top">
<div id="one">
<img src="content1_300x200px.gif">
</div>
<div id="two">
<img src="content2_300x200px.gif"
</div>
<div id="three">
<img src="content3_300x200px.gif"
</div>
<div id="nav">
<a href="#" onclick="one.style.visibility='visible'; two.style.visibility='hidden';
three.style.visibility='hidden';">show content 1</a>
<a href="#" onclick="two.style.visibility='visible'; one.style.visibility='hidden';
three.style.visibility='hidden';">show content 2</a>
<a href="#" onclick="three.style.visibility='visible'; two.style.visibility='hidden';
one.style.visibility='hidden';">show content 3</a>
</div>
</td>
<td width="50%" height="250px" valign="top">content table line 1, row 2</td>
<tr>
<td width="50%" height="250px" valign="top">content table line 2, row 1</td>
<td width="50%" height="250px" valign="top">content table line 2, row 2 </td>
</tr>
</table>
But: put into CMSMS all things get mixed up!
The positioning get's fuzzed, nothing stays in place.
I managed to get things work in IE5+ -- but now FF doesn't like it.
Where's the problem? Did I do something wrong? Or is it CMSMS that makes this 'mistake"?
Thanks for yor support!!
