Dragging Forms and Layers: form controls on a layer : Draggable Layer « Ajax Layer « JavaScript DHTML






Dragging Forms and Layers: form controls on a layer


http://dynapi.sourceforge.net/
GNU LESSER GENERAL PUBLIC LICENSE
Version 2.1, February 1999
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Dragging Forms & Layers</title>
<script language="Javascript" type="text/javascript" src="./dynapisrc/dynapi.js"></script>
<script language="Javascript" type="text/javascript">

dynapi.library.setPath('./dynapisrc/');
dynapi.library.include('dynapi.api');
dynapi.library.include('DragEvent')

//-->
</script>
<script language="Javascript" type="text/javascript">
  lyr = new DynLayer(null,50,50,250,200,'red');
  lyr.setHTML('drag me <form>'+
        '<input type="radio" value="1" name="r1" checked>'+
        '<input type="radio" value="1" name="r1">'+
        '<input type="checkbox" value="1"><br>'+
        '<input type="text" value="text">'+
        '<input type="button" value="submit">'+
        '<input type="image" name="myimage" src="./dynapisrc/ext/images/debug_imgreload.gif">'+
        '<textarea name="ta" cols=20 rows=3>textarea textarea textarea textarea textarea textarea textarea</textarea>'+
        '<br><img src="./dynapiexamples/images/arrowdown.gif" width=50 height=50></form>');

  dynapi.document.addChild(lyr);

  DragEvent.enableDragEvents(lyr);
  DragEvent.setDragBoundary(lyr);
</script>
</head>
<body bgcolor="#ffffff">
Issue: Unable to scroll or select text in some browsers (e.g. IE) when drag events are 
enabled on the layer
Try scrolling or selecting text within the text boxes

</body>
</html>

           
       








dynapi.zip( 791 k)

Related examples in the same category

1.Drag and Snap (SnapX)
2.Layer drag event
3.Dragging Large Child Layers
4.Relative Layers : Drag & drop example
5.Inline layer drag and drop
6.Draggable Layers