ScrollOverflowCheckPageYUI.html 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <title>scroll/auto overflow + relative position container sanity test page</title>
  5. <style type="text/css">
  6. #scroll, #auto {
  7. position:relative;
  8. margin-top:5em;
  9. margin-left:5em;
  10. border: 1px solid red;
  11. width:30em;
  12. height:20em;
  13. overflow: scroll;
  14. }
  15. .d {
  16. width:2em;
  17. height:2em;
  18. border: 1px dotted silver;
  19. position:absolute;
  20. z-index:5;
  21. }
  22. ._jsPlumb_connector { z-index:4; }
  23. ._jsPlumb_endpoint { z-index:6; }
  24. </style>
  25. </head>
  26. <body>
  27. <a href="ScrollOverflowCheckPage.html">jquery</a>
  28. <a href="ScrollOverflowCheckPageMooTools.html">mootools</a>
  29. <div id="scroll">
  30. <div id="w1" class="d"></div>
  31. <div id="w2" class="d"></div>
  32. </div>
  33. <div id="auto">
  34. <div id="w3" class="d"></div>
  35. <div id="w4" class="d"></div>
  36. </div>
  37. <script type="text/javascript" src="http://yui.yahooapis.com/3.3.0/build/simpleyui/simpleyui-min.js"></script>
  38. <!-- support lib for bezier stuff -->
  39. <script type="text/javascript" src="../../js/lib/jsBezier-0.3-min.js"></script>
  40. <!-- main jsplumb engine -->
  41. <script type="text/javascript" src="../../js/1.3.4/jsPlumb-1.3.4-RC1.js"></script>
  42. <!-- connectors, endpoint and overlays -->
  43. <script type="text/javascript" src="../../js/1.3.4/jsPlumb-defaults-1.3.4-RC1.js"></script>
  44. <!-- state machine connectors -->
  45. <script type="text/javascript" src="../../js/1.3.4/jsPlumb-connectors-statemachine-1.3.4-RC1.js"></script>
  46. <!-- SVG renderer -->
  47. <script type="text/javascript" src="../../js/1.3.4/jsPlumb-renderers-svg-1.3.4-RC1.js"></script>
  48. <!-- canvas renderer -->
  49. <script type="text/javascript" src="../../js/1.3.4/jsPlumb-renderers-canvas-1.3.4-RC1.js"></script>
  50. <!-- vml renderer -->
  51. <script type="text/javascript" src="../../js/1.3.4/jsPlumb-renderers-vml-1.3.4-RC1.js"></script>
  52. <!-- jquery jsPlumb adapter -->
  53. <script type="text/javascript" src="../../js/1.3.4/yui.jsPlumb-1.3.4-RC1.js"></script>
  54. <script type="text/javascript">
  55. jsPlumb.bind("ready", function() {
  56. jsPlumb.draggable(Y.all(".d"));
  57. jsPlumb.addEndpoint("w1", {
  58. anchor:"RightMiddle",
  59. isSource:true
  60. });
  61. jsPlumb.addEndpoint("w2", {
  62. anchor:"LeftMiddle",
  63. isTarget:true
  64. });
  65. jsPlumb.addEndpoint("w3", {
  66. anchor:"RightMiddle",
  67. isSource:true
  68. });
  69. jsPlumb.addEndpoint("w4", {
  70. anchor:"LeftMiddle",
  71. isTarget:true
  72. });
  73. jsPlumb.bind("click", function(c) { jsPlumb.detach(c); });
  74. });
  75. </script>
  76. </body>
  77. </html>