Hi there,
I'm currently building an HTML form that uses the slider control. I was able to call it without any problem, but as you'll see in the image below, the slider seems too small for its container since the ball disappears when I scroll to the right. Here's the associated code:
<div id="my_form">
<table width="1118" border="0">
<tr>
<td width="106">Étiquette:</td>
<td width="269">
<input type="text" name="txtEtiquette" id="txtEtiquette" style="width:260px">
</td>
<td width="133"> </td>
<td width="374"> </td>
<td width="214"> </td>
</tr>
<tr>
<td>Description:</td>
<td>
<input type="text" name="txtDescription" id="txtDescription" style="width:260px">
</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Notes:</td>
<td>
<input type="text" name="txtNotes" id="txtNotes" style="width:260px">
</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>À</td>
<td>
<select name="lstDestinataire" id="lstDestinataire" style="width:260px">
</select>
</td>
<td><input type="checkbox" name="optNotification" id="optNotification">Notification</td>
<td>Date</td>
<td>
Droits:
<select name="lstDroits" id="lstDroits" style="width:160px">
</select>
</td>
</tr>
<tr>
<td>CC</td>
<td> </td>
<td>Notification</td>
<td>Date</td>
<td>Droits</td>
</tr>
<tr>
<td>Client:</td>
<td>
<select name="lstClient" id="lstClient" style="width:260px">
</select>
</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Division:</td>
<td><select name="lstDivision" id="lstDivision" style="width:260px">
</select></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Priorité:</td>
<td>
<div id="slider" style="width:250px"></div>
<!--<script type="text/javascript">window.dhx_globalImgPath="js/slider/dhtmlxSlider/codebase/imgs/";</script> -->
<script>
var sld = new dhtmlxSlider("slider", {size:150, skin: "ball", vertical:false, step:1, min:1, max:100, value:1});
sld.setImagePath("js/slider/dhtmlxSlider/codebase/imgs/");
sld.init();
</script>
</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Complétion</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Statut</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Durée</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Statut</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Calendrier stratégique </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<input type="button" value="Fermer" onclick="close_form();" >
</div>
Anyone knows what on earth’s going on? I can’t figure out what I’m doing wrong. Thanks in advance. I’ve tried different combinations of width but the result is always the same, the right of the slider box gets truncated for some reason.