diff options
| author | laurence <laurenceseo99@gmail.com> | 2013-09-06 14:45:44 +0800 |
|---|---|---|
| committer | laurence <laurenceseo99@gmail.com> | 2013-09-06 14:45:44 +0800 |
| commit | 8e497ca8a99e8055d51427d07219a6c883426856 (patch) | |
| tree | eae5aa1ad57a4b62f1e9282a46fe01f21edf6319 /index.html | |
| parent | cc873672d0a997d150770b116b2ea2c99f31b845 (diff) | |
laurence
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 91 |
1 files changed, 91 insertions, 0 deletions
diff --git a/index.html b/index.html new file mode 100644 index 0000000..e98160f --- /dev/null +++ b/index.html @@ -0,0 +1,91 @@ +<html> +<head> +<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> +<link rel="stylesheet" type="text/css" href="./css/style.css"> +<link href='http://fonts.googleapis.com/css?family=Chivo:400italic' rel='stylesheet' type='text/css'> +<script type="text/javascript" src="./js/jquery-1.10.1.min.js"></script> +<script type="text/javascript" src="./js/jquery.fancybox.js?v=2.1.5"></script> +<link rel="stylesheet" type="text/css" href="./css/jquery.fancybox.css?v=2.1.5" media="screen" /> +</head> +<body style="background-color: #e6e0e0;"> + <div id="controls" style="display: block;"> + <span class="shim"></span> + + <label>resize width</label> + <input type="text" id="img-width"><small>px</small> + <br /> + + <label>resize height</label> + <input type="text" id="img-height"><small>px</small> + <br /> + + <label>nearest neighbor?</label> + <input type="checkbox" id="img-nearest" value="1"> + <br /> + + <span class="shim"></span> + + <label>recolor white</label> + <input type="text" id="img-white" value="white"> + <div id="colorswitcheroo"></div> + <br /> + + <label>recolor black</label> + <input type="text" id="img-black" value="black"> + <br /> + <span class="shim"></span> + + <label><a id="lnkcolorbox" style="font-size: 10px">List of Color Names</a></label> + <span class="shim"></span> + <label>hue <small>(0-200)</small></label> + <input type="text" id="img-hue" value=""> + <span class="shim"></span> + + <label>flip horizontally?</label> + <input type="checkbox" id="img-flop" value="1"> + <br> + + <label>flip vertically?</label> + <input type="checkbox" id="img-flip" value="1"> + <br> + + <label>rotate <small>(0-360)</small></label> + <input type="text" id="img-rotate" value=""><br /> + + <span class="shim"></span> + + <label>output format</label> + <select id="img-format"> + <option selected="selected">gif</option> + <option>jpg</option> + <option>png</option> + </select> + </div> + <script type="text/javascript"> + $("#lnkcolorbox").click(function() { + $.fancybox.open({ + href : 'colors.htm', + width : 700, // set the width + height : 560, + fitToView : true, + autoDimensions:false, + autoSize:false, + type : 'iframe', + closeBtn : false, + padding : 5, + beforeShow : function(){ + $('.fancybox-iframe').contents().find('#submitvalue').click(function(){ + $.fancybox.close(); + }); + }, + beforeClose : function(){ + x = $('.fancybox-iframe').contents().find('#namespace').val(); + }, + afterClose: function(){ + $('#img-hue').val(x); + } + }); + }); + </script> +</body> +</html> |