Mercurial Mercurial > eulalie / annotate
summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | file | latest | revisions | annotate | diff | comparison | raw | help
Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
web/static/css/jq-css/demos/toggle/default.html
author veltr
Wed, 18 Jul 2012 18:23:49 +0200
changeset 80 00a3532ad8cf
parent 30 81d408373dde
permissions -rw-r--r--
Adapted Event communications to Madani's proposed syntax
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
30
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
     1
 
<!DOCTYPE html>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
     2
 
<html lang="en">
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
     3
 
<head>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
     4
 
	<meta charset="UTF-8" />
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
     5
 
	<title>jQuery UI Effects - Toggle Demo</title>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
     6
 
	<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
     7
 
	<script type="text/javascript" src="../../jquery-1.4.2.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
     8
 
	<script type="text/javascript" src="../../ui/jquery.effects.core.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
     9
 
	<script type="text/javascript" src="../../ui/jquery.effects.blind.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    10
 
	<script type="text/javascript" src="../../ui/jquery.effects.bounce.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    11
 
	<script type="text/javascript" src="../../ui/jquery.effects.clip.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    12
 
	<script type="text/javascript" src="../../ui/jquery.effects.drop.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    13
 
	<script type="text/javascript" src="../../ui/jquery.effects.explode.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    14
 
	<script type="text/javascript" src="../../ui/jquery.effects.fold.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    15
 
	<script type="text/javascript" src="../../ui/jquery.effects.highlight.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    16
 
	<script type="text/javascript" src="../../ui/jquery.effects.pulsate.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    17
 
	<script type="text/javascript" src="../../ui/jquery.effects.scale.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    18
 
	<script type="text/javascript" src="../../ui/jquery.effects.shake.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    19
 
	<script type="text/javascript" src="../../ui/jquery.effects.slide.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    20
 
	<script type="text/javascript" src="../../ui/jquery.effects.transfer.js"></script>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    21
 
	<link type="text/css" href="../demos.css" rel="stylesheet" />
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    22
 
	<style type="text/css">
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    23
 
		.toggler { width: 500px; height: 200px; }
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    24
 
		#button { padding: .5em 1em; text-decoration: none; }
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    25
 
		#effect { width: 240px; height: 135px; padding: 0.4em; position: relative; }
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    26
 
		#effect h3 { margin: 0; padding: 0.4em; text-align: center; }
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    27
 
		.ui-effects-transfer { border: 2px dotted gray; }
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    28
 
	</style>
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    29
 
	<script type="text/javascript">
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    30
 
	$(function() {
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    31
 
		//run the currently selected effect
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    32
 
		function runEffect(){
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    33
 
			//get effect type from
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    34
 
			var selectedEffect = $('#effectTypes').val();
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    35
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    36
 
			//most effect types need no options passed by default
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    37
 
			var options = {};
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    38
 
			//check if it's scale, transfer, or size - they need options explicitly set
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    39
 
			if(selectedEffect == 'scale'){  options = {percent: 0}; }
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    40
 
			else if(selectedEffect == 'size'){ options = { to: {width: 200,height: 60} }; }
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    41
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    42
 
			//run the effect
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    43
 
			$("#effect").toggle(selectedEffect,options,500);
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    44
 
		};
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    45
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    46
 
		//set effect from select menu value
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    47
 
		$("#button").click(function() {
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    48
 
			runEffect();
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    49
 
			return false;
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    50
 
		});
81d408373dde itry to have the player in the preview page
ymh <ymh.work@gmail.com>
parents:
diff changeset 
    51
 












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    52


	});












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    53


	</script>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    54


</head>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    55


<body>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    56














81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    57


<div class="demo">












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    58














81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    59


<div class="toggler">












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    60


	<div id="effect" class="ui-widget-content ui-corner-all">












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    61


		<h3 class="ui-widget-header ui-corner-all">Toggle</h3>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    62


		<p>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    63


			Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    64


		</p>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    65


	</div>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    66


</div>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    67














81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    68


<select name="effects" id="effectTypes">












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    69


	<option value="blind">Blind</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    70


	<option value="bounce">Bounce</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    71


	<option value="clip">Clip</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    72


	<option value="drop">Drop</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    73


	<option value="explode">Explode</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    74


	<option value="fold">Fold</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    75


	<option value="highlight">Highlight</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    76


	<option value="puff">Puff</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    77


	<option value="pulsate">Pulsate</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    78


	<option value="scale">Scale</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    79


	<option value="shake">Shake</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    80


	<option value="size">Size</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    81


	<option value="slide">Slide</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    82


	<option value="transfer">Transfer</option>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    83


</select>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    84














81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    85


<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    86


</div><!-- End demo -->












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    87














81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    88


<div class="demo-description">












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    89














81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    90


<p>Click the button above to preview the effect.</p>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    91














81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    92


</div><!-- End demo-description -->












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    93














81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    94


</body>












81d408373dde
itry to have the player in the preview page



ymh <ymh.work@gmail.com>


parents: 

diff
changeset




    95


</html>














eulalie