diff options
author | Alvin Li <liweitianux@gmail.com> | 2013-08-22 15:18:58 +0800 |
---|---|---|
committer | Alvin Li <liweitianux@gmail.com> | 2013-08-22 15:18:58 +0800 |
commit | 3f1d09f3b5b86157ccf9f47eef69a065be6153a4 (patch) | |
tree | 84d424db169cea7daff7dc2ed7e045de15ec86eb /97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/toggle/default.html | |
parent | 3ef1e03e4273544cce177ce7fa0e0ab75eded990 (diff) | |
download | 97dev-3f1d09f3b5b86157ccf9f47eef69a065be6153a4.tar.bz2 |
* added latest full package of 'jquery-ui' plugin, v1.10.3;
* improved 'thickbox' plugin to use 'jquery-1.9.x';
* upgraded 'SheetDefault.html', 'NewDeleteIndex.html' and other pages
to use 'jquery-1.9.x';
* improved 'IndexDesc.html' to deal with the problem of no related
annotation found;
* 'indicator.tools.get_record()' added param 'number', and updated
the format of return data;
* added 'get_num_record()' and 'get_num_record_std()' to
'indicator.tools';
* improved 'indicator.views.ajax_get_card_data_chart()',
now can get data by 'num' or by 'date';
* improved 'indicator.views.ajax_get_card_data_table()',
to provide the needed data requested from 'detail_card';
* improved js function 'chart_getdata_draw()' in 'SheetDefault.html';
* 'card_chart.js': renamed 'redraw_chart()' to
'detail_chart_getdata_draw()', and updated to get data by type;
* updated 'table' of 'detail_card' in 'SheetDefault.html';
* improved js function 'get_card_data_table()' for providing and
displaying record data in 'detail_card' table.
TODO:
* add/delete/edit record data
Diffstat (limited to '97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/toggle/default.html')
-rw-r--r-- | 97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/toggle/default.html | 103 |
1 files changed, 103 insertions, 0 deletions
diff --git a/97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/toggle/default.html b/97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/toggle/default.html new file mode 100644 index 0000000..3543939 --- /dev/null +++ b/97suifangqa/apps/indicator/static/plugins/jquery-ui/demos/toggle/default.html @@ -0,0 +1,103 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Effects - Toggle Demo</title> + <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> + <script src="../../jquery-1.9.1.js"></script> + <script src="../../ui/jquery.ui.effect.js"></script> + <script src="../../ui/jquery.ui.effect-blind.js"></script> + <script src="../../ui/jquery.ui.effect-bounce.js"></script> + <script src="../../ui/jquery.ui.effect-clip.js"></script> + <script src="../../ui/jquery.ui.effect-drop.js"></script> + <script src="../../ui/jquery.ui.effect-explode.js"></script> + <script src="../../ui/jquery.ui.effect-fold.js"></script> + <script src="../../ui/jquery.ui.effect-highlight.js"></script> + <script src="../../ui/jquery.ui.effect-pulsate.js"></script> + <script src="../../ui/jquery.ui.effect-scale.js"></script> + <script src="../../ui/jquery.ui.effect-shake.js"></script> + <script src="../../ui/jquery.ui.effect-slide.js"></script> + <link rel="stylesheet" href="../demos.css"> + <style> + .toggler { + width: 500px; + height: 200px; + } + #button { + padding: .5em 1em; + text-decoration: none; + } + #effect { + position: relative; + width: 240px; + height: 135px; + padding: 0.4em; + } + #effect h3 { + margin: 0; + padding: 0.4em; + text-align: center; + } + </style> + <script> + $(function() { + // run the currently selected effect + function runEffect() { + // get effect type from + var selectedEffect = $( "#effectTypes" ).val(); + + // most effect types need no options passed by default + var options = {}; + // some effects have required parameters + if ( selectedEffect === "scale" ) { + options = { percent: 0 }; + } else if ( selectedEffect === "size" ) { + options = { to: { width: 200, height: 60 } }; + } + + // run the effect + $( "#effect" ).toggle( selectedEffect, options, 500 ); + }; + + // set effect from select menu value + $( "#button" ).click(function() { + runEffect(); + return false; + }); + }); + </script> +</head> +<body> + +<div class="toggler"> + <div id="effect" class="ui-widget-content ui-corner-all"> + <h3 class="ui-widget-header ui-corner-all">Toggle</h3> + <p> + Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi. + </p> + </div> +</div> + +<select name="effects" id="effectTypes"> + <option value="blind">Blind</option> + <option value="bounce">Bounce</option> + <option value="clip">Clip</option> + <option value="drop">Drop</option> + <option value="explode">Explode</option> + <option value="fold">Fold</option> + <option value="highlight">Highlight</option> + <option value="puff">Puff</option> + <option value="pulsate">Pulsate</option> + <option value="scale">Scale</option> + <option value="shake">Shake</option> + <option value="size">Size</option> + <option value="slide">Slide</option> +</select> + +<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a> + +<div class="demo-description"> +<p>Click the button above to preview the effect.</p> +</div> +</body> +</html> |