c9f5766162
Arrows on spoilers now change orientation when spoiler opens and closes. Flickerer box can be clicked on to change between colors once.
109 lines
4.1 KiB
HTML
109 lines
4.1 KiB
HTML
<!DOCTYPE html>
|
|
|
|
<meta name="viewport" content="width=device-width">
|
|
|
|
<html>
|
|
<head>
|
|
<title>Color Flickerer</title>
|
|
<script src="../jquery-3.2.0.min.js"></script>
|
|
</head>
|
|
<body>
|
|
<style>
|
|
|
|
span.label {
|
|
vertical-align: top;
|
|
}
|
|
|
|
body {
|
|
font-family: Inconsolata;
|
|
font-size: 14px;
|
|
line-height: 150%;
|
|
}
|
|
|
|
div {
|
|
width: 256px;height: 256px
|
|
}
|
|
div.bg {
|
|
background-color: #FFFFFF;
|
|
}
|
|
|
|
td.flickerbox {
|
|
width: 256px;
|
|
height: 256px;
|
|
border: 1px solid #888888;
|
|
}
|
|
</style>
|
|
|
|
|
|
|
|
|
|
<!--<br/><br/>
|
|
Colors (00-FF): <input type="text" id="c1 in" size="1" maxlength="2" style="text-align: center;"/> <input type="text" id="c2 in" size="1" maxlength="2" style="text-align: center;"/> <button onclick="UpdateC()">Update</button>
|
|
<br/><br/>-->
|
|
<table style="padding-left: 20px;">
|
|
<tr>
|
|
<td style="background-color: #CCCCCC; border: 1px solid #000000; font-weight: bold; text-align: center; cursor: pointer; height: 50px;" colspan="3" onclick="OnOffToggle(); RunC();">
|
|
On / Off
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="3" style="text-align: center;">
|
|
|
|
<!--<label><input type="checkbox" id="button" onclick="RunC();"/><span class="label">Enable</span></label>
|
|
<br/><br/>-->
|
|
<table align="center">
|
|
<tr>
|
|
<td style="text-align: left;">
|
|
<label><input type="radio" name="framerate" id="f1" onclick="RunC();" checked/><span class="label">Single Frames</span></label>
|
|
<br/>
|
|
<label><input type="radio" name="framerate" id="f2" onclick="RunC();"/><span class="label">Double Frames</span></label>
|
|
<br/>
|
|
<label><input type="radio" name="framerate" id="f4" onclick="RunC();"/><span class="label">Quadruple Frames</span></label>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: center">
|
|
C1
|
|
</td>
|
|
<td> </td>
|
|
<td style="text-align: center">
|
|
C2
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="text-align: center;">
|
|
<form id="c1form">
|
|
<label><input type="radio" name="c1radio" onclick="UpdateCR();" value="0" checked/><span class="label">000 (#00)</span></label><br/>
|
|
<label><input type="radio" name="c1radio" onclick="UpdateCR();" value="50"/><span class="label">050 (#32)</span></label><br/>
|
|
<label><input type="radio" name="c1radio" onclick="UpdateCR();" value="100"/><span class="label">100 (#64)</span></label><br/>
|
|
<label><input type="radio" name="c1radio" onclick="UpdateCR();" value="150"/><span class="label">150 (#96)</span></label><br/>
|
|
<label><input type="radio" name="c1radio" onclick="UpdateCR();" value="200"/><span class="label">200 (#C8)</span></label><br/>
|
|
<br/>
|
|
</form>
|
|
</td>
|
|
<td></td>
|
|
<td style="text-align: center;">
|
|
<form id="c2form">
|
|
<label><input type="radio" name="c2radio" onclick="UpdateCR();" value="50"/><span class="label">050 (#32)</span></label><br/>
|
|
<label><input type="radio" name="c2radio" onclick="UpdateCR();" value="100"/><span class="label">100 (#64)</span></label><br/>
|
|
<label><input type="radio" name="c2radio" onclick="UpdateCR();" value="150"/><span class="label">150 (#96)</span></label><br/>
|
|
<label><input type="radio" name="c2radio" onclick="UpdateCR();" value="200"/><span class="label">200 (#C8)</span></label><br/>
|
|
<label><input type="radio" name="c2radio" onclick="UpdateCR();" value="255" checked/><span class="label">255 (#FF)</span></label><br/>
|
|
<br/>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="flickerbox" colspan="3" id="a" onmousedown="turnBlack();" onmouseup="turnWhite();">
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
|
|
<script src="flickerJS.js"></script>
|
|
</body>
|
|
</html>
|