M
Matt Epstein
Hi. I need to implement a page that has a horizontal splitter (i.e.
like what you get between frames in a frameset) using javascript.
Right now I am experimenting with three div's, one for the top area,
one for the splitter iteself and one for the bottom area, but I can't
get the splitter to drag and resize properly.
My HTML looks like this:
<table>
<... other table elements ...>
<tr>
<td height="500" width="800" align="center">
<div id="divImaging" style="LEFT:10px; OVERFLOW:scroll; WIDTH:800px;
POSITION:absolute; TOP:165px; HEIGHT:245px">
<asp:image id="imgScan" runat="server"></asp:image>
</div>
<div id="divSplitter" class="mov" style="LEFT:10px; WIDTH:800px;
POSITION:absolute; TOP:410px; HEIGHT:10px; OVERFLOW: hidden;">
<img src="../images/topBar_span.gif" height="10" width="800"
border="0">
</div>
<div id="divTextEditor" style="LEFT:10px; WIDTH:800px;
POSITION:absolute; TOP:420px; HEIGHT:245px">
</div>
</td>
</tr>
<... other table elements ...>
</table>
My javascript is so bad it's not worth posting...
I was surprised I couldn't find any specific code examples -- most
samples were way over my head and involved dragging geometric shapes
all over the place.
If anyone has some simple code, or a place to find a good example, I
would really appreciate it.
TIA,
Matt
like what you get between frames in a frameset) using javascript.
Right now I am experimenting with three div's, one for the top area,
one for the splitter iteself and one for the bottom area, but I can't
get the splitter to drag and resize properly.
My HTML looks like this:
<table>
<... other table elements ...>
<tr>
<td height="500" width="800" align="center">
<div id="divImaging" style="LEFT:10px; OVERFLOW:scroll; WIDTH:800px;
POSITION:absolute; TOP:165px; HEIGHT:245px">
<asp:image id="imgScan" runat="server"></asp:image>
</div>
<div id="divSplitter" class="mov" style="LEFT:10px; WIDTH:800px;
POSITION:absolute; TOP:410px; HEIGHT:10px; OVERFLOW: hidden;">
<img src="../images/topBar_span.gif" height="10" width="800"
border="0">
</div>
<div id="divTextEditor" style="LEFT:10px; WIDTH:800px;
POSITION:absolute; TOP:420px; HEIGHT:245px">
</div>
</td>
</tr>
<... other table elements ...>
</table>
My javascript is so bad it's not worth posting...
I was surprised I couldn't find any specific code examples -- most
samples were way over my head and involved dragging geometric shapes
all over the place.
If anyone has some simple code, or a place to find a good example, I
would really appreciate it.
TIA,
Matt