projects / dygraphs.git / blame
| Commit | Line | Data |
|---|---|---|
| 6a1aa64f DV |
1 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" |
| 2 | "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> | |
| 3 | <html xmlns="http://www.w3.org/1999/xhtml"> | |
| 4 | <head> | |
| 5 | <title>Full Effects Test Suite</title> | |
| 6 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | |
| 7 | <link rel="stylesheet" href="../../include/css/documentation.css" type="text/css" /> | |
| 8 | <script src="../../MochiKit/MochiKit.js" type="text/javascript"></script> | |
| 9 | <style type="text/css"> | |
| 10 | #demo { | |
| 11 | } | |
| 12 | ||
| 13 | #demo li { | |
| 14 | color: #8ba726; | |
| 15 | font-size: 1.2em; | |
| 16 | } | |
| 17 | ||
| 18 | #democontainer { | |
| 19 | margin: 30px 5px 0px 5px; | |
| 20 | } | |
| 21 | ||
| 22 | #demoall { | |
| 23 | position: absolute; | |
| 24 | top: 250px; | |
| 25 | left: 400px; | |
| 26 | font-size: 20px; | |
| 27 | background: #f3f3f3; | |
| 28 | color: #1C1D1F; | |
| 29 | text-align: center; | |
| 30 | border: 1px solid #ccc; | |
| 31 | width: 150px; | |
| 32 | height: 150px; | |
| 33 | } | |
| 34 | </style> | |
| 35 | </head> | |
| 36 | ||
| 37 | <body> | |
| 38 | <div class="document"> | |
| 39 | <div class="section"> | |
| 40 | <h1>Full Effects Test Suite</h1> | |
| 41 | <ul id="demo"> | |
| 42 | <li onclick="setStyle('demoall', {'display': 'block'});fade('demoall')">fade</li> | |
| 43 | <li onclick="setStyle('demoall', {'display': 'none'});appear('demoall')">appear</li> | |
| 44 | <li onclick="setStyle('demoall', {'display': 'block'});puff('demoall')">puff</li> | |
| 45 | <li onclick="blindDown('demoall')">blindDown</li> | |
| 46 | <li onclick="setStyle('demoall', {'display': 'block'});blindUp('demoall')">blindUp</li> | |
| 47 | <li onclick="switchOff('demoall')">switchOff</li> | |
| 48 | <li onclick="slideDown('demoall')">slideDown</li> | |
| 49 | <li onclick="slideUp('demoall')">slideUp</li> | |
| 50 | <li onclick="setStyle('demoall', {'display': 'block'});dropOut('demoall', {'distance': 500})">dropOut</li> | |
| 51 | <li onclick="setStyle('demoall', {'display': 'block'});shake('demoall')">shake</li> | |
| 52 | <li onclick="setStyle('demoall', {'display': 'block'});pulsate('demoall')">pulsate</li> | |
| 53 | <li onclick="setStyle('demoall', {'display': 'block'});squish('demoall')">squish</li> | |
| 54 | <li onclick="setStyle('demoall', {'display': 'block'});fold('demoall')">fold</li> | |
| 55 | <li onclick="grow('demoall')">grow</li> | |
| 56 | <li onclick="setStyle('demoall', {'display': 'block'});shrink('demoall')">shrink</li> | |
| 57 | <li onclick="setStyle('demoall', {'display': 'block'});Highlight('demoall', {startcolor: '#ffff33'})">Highlight</li> | |
| 58 | <li onclick="setStyle('demoall', {'display': 'block'});Morph('demoall', {'style': {'font-size': '3px'}, 'queue': 'start'});Morph('demoall', {'style': {'font-size': '20px'}, 'queue': 'end'});">Morph font</li> | |
| 59 | <li onclick="setStyle('demoall', {'display': 'block'});Morph('demoall', {'style': {'background-color': 'red'}, 'queue': 'start'});Morph('demoall', {'style': {'background-color': '#f3f3f3'}, 'queue': 'end'});">Morph color</li> | |
| 60 | <li onclick="toggle('demoall', 'blind')">toggle (blind)</li> | |
| 61 | <li onclick="toggle('demoall', 'slide')">toggle (slide)</li> | |
| 62 | <li onclick="toggle('demoall', 'appear')">toggle (appear)</li> | |
| 63 | <li onclick="toggle('demoall', 'size')">toggle (size)</li> | |
| 64 | </ul> | |
| 65 | <div id="demoall"> | |
| 66 | <div id="democontainer">Click on one of the left to see the effect</div> | |
| 67 | </div> | |
| 68 | </div> | |
| 69 | </div> | |
| 70 | </body> | |
| 71 | </html> |