You are here: Home → eForms → Workshop → eForm Base HTML
Navigation
« May 2012 »
Su Mo Tu We Th Fr Sa
12345
6789101112
13141516171819
20212223242526
2728293031
 
Document Actions

eForm Base HTML

by Sarah Allen — last modified 2009-10-09 12:42

The base HTML to use when creating new eForms

Click here to get the file

Size 3.5 kB - File type text/html

File contents

<html>

<head>

<!-- CSS Script that removes textarea and textbox borders when printing -->
<style type="text/css" media="print">
td.subjectline {
    display:none;
}
input {
    border : 0px;
    background: transparent;
    font-family: Arial; 
    font-size: 12px;
}

textarea {
    scrollbar-3dlight-color: transparent;
    scrollbar-3dlight-color: transparent;
    scrollbar-arrow-color: transparent;
    scrollbar-base-color: transparent;
    scrollbar-darkshadow-color: transparent;
    scrollbar-face-color: transparent;
    scrollbar-highlight-color: transparent;
    scrollbar-shadow-color: transparent;
    scrollbar-track-color: transparent;
    background: transparent;
    overflow: hidden;
    border : 0px;

    font-family: Arial; 
    font-size: 12px;
}

</style>
<!-- ------------------------------------------------------------------ -->

<!-- SCRIPT GIVES THE MOUSE COORDINATES----- -->
<script type="text/javascript" language="javascript">
var isIE = document.all?true:false;
if (!isIE) document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = getMousePosition;
document.onclick = captureposition;
var capX = 0;
var capY = 0;
var sy = 0;
var sx = 0;
function getMousePosition(e) {
  var _x;
  var _y;
  if (!isIE) {
    _x = e.pageX;
    _y = e.pageY;
  }
  document.title = _x + " " + _y;
  return true;
}
function captureposition(e) {

  if (e.shiftKey) {
     if ((capX == 0) && (capY == 0)) {
        capX = e.pageX;
        capY = e.pageY;
     } else {
        var diffX = e.pageX-capX;
        var diffY = e.pageY-capY;
        if (Math.abs(diffX) > Math.abs(diffY)) {
            alert('X-coordinate distance: ' + diffX + 'px');
        } else {
            alert('Y-coordinate distance: ' + diffY + 'px');
        }
        capX = 0;
        capY = 0;
     }
   }
}
</script>
<!-- ------------------------------------------- -->

</head>

<body width="750px">
<div style="margin-left: 10px; margin-top: 10px;"><IMG SRC="${oscar_image_path}myimage.png"></div>
<!-- You can remove ${oscar_image_path} as you develop the form, but make sure you put it back before uploading to OSCAR otherwise the image wouldn't show.
<!-- Also note: the image filename IS CASE SENSITIVE INCLUDING THE EXTENSION. It may work otherwise in Windows, but not in OSCAR because it's based on a Linux platform -->


<form method="POST" action="">
<!-- ----------------------------All textfields/checkboxes/textareas go here...------ -->

<div style="position: absolute; left:90px; top:5px;">
    <input type="text" name="thisfield121" style="width: 289px;" tabindex="1">
</div>

<div style="position: absolute; left:90px; top:30px;">
    <textarea name="thisfield122" style="height: 83px; width: 289px;" tabindex="2"></textarea>
</div>

<div style="position: absolute; left:90px; top:130px;">
        <input type="checkbox" name="thischeckbox1042">
</div>
 

<!-- --------------------------------------------------------------------- -->


<!-- The submit/print/reset buttons -->
<div style="position: absolute; top: 922px; left: 27px;">
  <table>
     <tr>
        <td class="subjectline">
             Subject: <input type="text" name=subject size="40">&nbsp;
             <input type="submit" value="Submit" name="B1">
             <input type="reset" value="Reset" name="B2">
             <input type=button value=Print onclick="javascript:window.print()">
        </td>
     </tr>
  </table>
</div>
</form>
</body>

</html>
Personal tools