📄 dragdrop_delay_test.html
字号:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>script.aculo.us functional test</title> <script type="text/javascript" src="../../lib/prototype.js"></script> <script type="text/javascript" src="../../src/effects.js"></script> <script type="text/javascript" src="../../src/dragdrop.js"></script> <script type="text/javascript"> //<![CDATA[ var myStartEffect = function(element) { element._opacity = Element.getOpacity(element); new Effect.Opacity(element, {duration:0.2, from:element._opacity, to:0.7}); new Effect.Highlight(element, {}); } //]]> </script> <style type="text/css"> /*<![CDATA[*/ h1 {font-size: 1.2em; text-align:center;} li { margin: 5px auto; padding: 2px; width: 200px; text-align:center; list-style-type:none; border: 2px solid #779; background-color: #dde } div { margin: 5px auto; padding: 2px; width: 300px; text-align:center; border: 2px solid #797; background-color: #ded } /*]]>*/ </style></head><body> <h1>No delay sortable</h1> <ul id="sort1"> <li id="s1_1">one</li> <li id="s1_2">two</li> <li id="s1_3">three</li> </ul> <h1>Delayed sortable (500 ms)</h1> <ul id="sort2"> <li id="s2_1">one</li> <li id="s2_2">two</li> <li id="s2_3">three</li> </ul> <h1>No delay draggable</h1> <div id="drag1"> Lorem ipsum </div> <h1>Delayed draggable (1000 ms)</h1> <div id="drag2"> Lorem ipsum </div> <script type="text/javascript" charset="utf-8"> Sortable.create('sort1', {starteffect: myStartEffect}); Sortable.create('sort2', {starteffect:myStartEffect, delay:500}); new Draggable('drag1', {starteffect:myStartEffect}); new Draggable('drag2', {starteffect:myStartEffect, delay:1000}); </script></body></html>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -