Friday, March 24, 2017

compositor

apply
*

<input id="sns20170324f1214i" />
<a href="javascript:sns20170324f1214()" style="color: greenyellow; font-size: 2em;">apply</a>
<br />
<div id="sns20170324f1214f" style="height: 400px; left: 0px; position: absolute; top: 100px; width: 600px;">
</div>
<script>

function sns20170324f1214() {
document.getElementById("sns20170324f1214f").innerHTML = document.getElementById("sns20170324f1214i").value}


</script>



<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250updownpanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250lowerspeed"></div></div>
<div id="sns20170324f1250leftrightpanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250leftrightslower"></div></div>
<div id="sns20170324f1250plusminuspanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250lowerspeed"></div></div>

<style>
#sns20170324f1250updownpanel {position:absolute;left:0%;top:0%;width:33.33%;height:100%}
#sns20170324f1250leftrightpanel {position:absolute;left:33.33%;top:0%;width:33.33%;height:100%}
#sns20170324f1250plusminuspanel {position:absolute;left:66.66%;top:0%;width:33.33%;height:100%}
.sns20170324f1250uppermotion {position:absolute;left:0%;top:0%;width:66.66%;height:20%;background-color:lightgrey}
.sns20170324f1250lowermotion {position:absolute;left:0%;bottom:0%;width:66.66%;height:20%;background-color:lightgrey}
.sns20170324f1250upperspeed {position:absolute;left:66.66%;top:20%;width:33.33%;height:15%;background-color:lightgrey}
.sns20170324f1250lowerspeed {position:absolute;left:66.66%;bottom:20%;width:33.33%;height:15%;background-color:lightgrey}
</style>



</div>






<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250updownpanel">
<div class="sns20170324f1250uppermotion"></div></div>
<div id="sns20170324f1250leftrightpanel">
<div class="sns20170324f1250uppermotion"></div><div>

<style>
#sns20170324f1250updownpanel {position:absolute;left:0%;top:0%;width:33.33%;height:100%}
.sns20170324f1250uppermotion {position:absolute;left:0%;top:0%;width:66.66%;height:20%;background-color:lightgrey}
#sns20170324f1250leftrightpanel {position:absolute;left:33.33%;top:0%;width:33.33%;height:100%}
</style>



</div>






<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250updownpanel">
<div class="sns20170324f1250uppermotion"></div></div>
<div id="sns20170324f1250leftrightpanel">
<div class="sns20170324f1250uppermotion"></div><div>

<style>
#sns20170324f1250updownpanel {position:absolute;left:0%;top:0%;width:33.33%;height:100%}
.sns20170324f1250uppermotion {position:absolute;left:0%;top:0%;width:66.66%;height:20%;background-color:lightgrey}
#sns20170324f1250leftrightpanel {position:absolute;left:33.33%;top:0%;width:33.33%;height:100%}
</style>



</div>





<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250updownpanel">
<div class="sns20170324f1250uppermotion"></div></div>

<style>
#sns20170324f1250updownpanel {position:absolute;left:0%;top:0%;width:33.33%;height:100%}
.sns20170324f1250uppermotion {position:absolute;left:0%;top:0%;width:66.66%;height:20%;background-color:lightgrey}
</style>



</div>






<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250updownpanel">
<div class="sns20170324f1250uppermotion"></div></div>
<div id="sns20170324f1250leftrightpanel">
<div class="sns20170324f1250uppermotion"></div><div>
<div id="sns20170324f1250plusminuspanel">
<div class="sns20170324f1250uppermotion"></div></div>

<style>
#sns20170324f1250updownpanel {position:absolute;left:0%;top:0%;width:33.33%;height:100%}
#sns20170324f1250leftrightpanel {position:absolute;left:33.33%;top:0%;width:33.33%;height:100%}
#sns20170324f1250plusminuspanel {position:absolute;left:66.66%;top:0%;width:33.33%;height:100%}
.sns20170324f1250uppermotion {position:absolute;left:0%;top:0%;width:66.66%;height:20%;background-color:lightgrey}
</style>



</div>







<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250updownpanel">
<div class="sns20170324f1250uppermotion"></div></div>
<div id="sns20170324f1250leftrightpanel">
<div class="sns20170324f1250uppermotion"></div><div>
<div id="sns20170324f1250plusminuspanel">
<div class="sns20170324f1250uppermotion"></div></div>

<style>
#sns20170324f1250updownpanel {position:absolute;left:0%;top:0%;width:33.33%;height:100%}
#sns20170324f1250leftrightpanel {position:absolute;left:33.33%;top:0%;width:33.33%;height:100%}
#sns20170324f1250plusminuspanel {position:absolute;left:66.66%;top:0%;width:33.33%;height:100%}
.sns20170324f1250uppermotion {position:absolute;left:0%;top:0%;width:66.66%;height:20%;background-color:lightgrey}
</style>



</div>





<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250updownpanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250lowerspeed"></div></div>
<div id="sns20170324f1250leftrightpanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250leftrightslower"></div><div>
<div id="sns20170324f1250plusminuspanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250lowerspeed"></div></div>

<style>
#sns20170324f1250updownpanel {position:absolute;left:0%;top:0%;width:33.33%;height:100%}
#sns20170324f1250leftrightpanel {position:absolute;left:33.33%;top:0%;width:33.33%;height:100%}
#sns20170324f1250plusminuspanel {position:absolute;left:66.66%;top:0%;width:33.33%;height:100%}
.sns20170324f1250uppermotion {position:absolute;left:0%;top:0%;width:66.66%;height:20%;background-color:lightgrey}
.sns20170324f1250lowermotion {position:absolute;left:0%;bottom:0%;width:66.66%;height:20%;background-color:lightgrey}
.sns20170324f1250upperspeed {position:absolute;left:66.66%;top:20%;width:33.33%;height:15%;background-color:lightgrey}
.sns20170324f1250lowerspeed {position:absolute;left:66.66%;bottom:20%;width:33.33%;height:15%;background-color:lightgrey}
</style>



</div>






<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250updownpanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250lowerspeed"></div></div>
<div id="sns20170324f1250leftrightpanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250leftrightslower"></div><div>
<div id="sns20170324f1250plusminuspanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250lowerspeed"></div></div>

<style>
#sns20170324f1250updownpanel {position:absolute;left:0%;top:0%;width:33.33%;height:100%}
#sns20170324f1250leftrightpanel {position:absolute;left:33.33%;top:0%;width:33.33%;height:100%}
#sns20170324f1250plusminuspanel {position:absolute;left:66.66%;top:0%;width:33.33%;height:100%}
.sns20170324f1250uppermotion {position:absolute;left:0%;top:0%;width:66.66%;height:20%;background-color:lightgrey}
.sns20170324f1250lowermotion {position:absolute;left:0%;bottom:0%;width:66.66%;height:20%;background-color:lightgrey}
.sns20170324f1250upperspeed {position:absolute;left:33.33%;top:20%;width:33.33%;height:15%;background-color:lightgrey}
.sns20170324f1250lowerspeed {position:absolute;left:33.33%;bottom:20%;width:33.33%;height:15%;background-color:lightgrey}
</style>



</div>




<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250updownpanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250lowerspeed"></div></div>
<div id="sns20170324f1250leftrightpanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250leftrightslower"></div><div>
<div id="sns20170324f1250plusminuspanel">
<div class="sns20170324f1250uppermotion"></div>
<div class="sns20170324f1250lowermotion"></div>
<div class="sns20170324f1250upperspeed"></div>
<div class="sns20170324f1250lowerspeed"></div></div>

<style>
#sns20170324f1250updownpanel {position:absolute;left:0%;top:0%;width:33.33%;height:100%}
#sns20170324f1250updownpanel {position:absolute;left:33.33%;top:0%;width:33.33%;height:100%}
#sns20170324f1250updownpanel {position:absolute;left:66.66%;top:0%;width:33.33%;height:100%}
.sns20170324f1250uppermotion {position:absolute;left:0%;top:0%;width:66.66%;height:20%;background-color:lightgrey}
.sns20170324f1250lowermotion {position:absolute;left:0%;bottom:0%;width:66.66%;height:20%;background-color:lightgrey}
.sns20170324f1250upperspeed {position:absolute;left:33.33%;top:20%;width:33.33%;height:15%;background-color:lightgrey}
.sns20170324f1250lowerspeed {position:absolute;left:33.33%;bottom:20%;width:33.33%;height:15%;background-color:lightgrey}
</style>



</div>






<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250up"></div>
<div id="sns20170324f1250down"></div>
<div id="sns20170324f1250updownfaster"></div>
<div id="sns20170324f1250updownslower"></div>
<div id="sns20170324f1250left"></div>
<div id="sns20170324f1250right"></div>
<div id="sns20170324f1250leftrightfaster"></div>
<div id="sns20170324f1250leftrightslower"></div>
<div id="sns20170324f1250plus"></div>
<div id="sns20170324f1250minus"></div>
<div id="sns20170324f1250plusminusfaster"></div>
<div id="sns20170324f1250plusminusslower"></div>

<style>
#sns20170324f1250up {position:absolute;left:0%;top:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250down {position:absolute;left:0%;bottom:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250updownfaster {position:absolute;left:20%;top:20%;width:15%;height:15%;background-color:lightgrey}
#sns20170324f1250updownslower {position:absolute;left:20%;bottom:20%;width:15%;height:15%;background-color:lightgrey}
#sns20170324f1250left {position:absolute;left:35%;top:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250right {position:absolute;left:35%;bottomm:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250leftrightfaster {position:absolute;left:55%;top:20%;width:15%;height:15%;background-color:lightgrey}
#sns20170324f1250leftrightslower {position:absolute;left:55%;bottom:20%;width:15%;height:15%;background-color:lightgrey}
#sns20170324f1250plus {position:absolute;left:70%;top:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250minus {position:absolute;left:70%;bottom:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250plusminusfaster {position:absolute;left:90%;top:20%;width:15%;height:15%;background-color:lightgrey}
#sns20170324f1250plusminusslower {position:absolute;left:90%;bottom:20%;width:15%;height:15%;background-color:lightgrey}
</style>



</div>



<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div id="sns20170324f1250up"></div>
<div id="sns20170324f1250down"></div>
<div id="sns20170324f1250updownfaster"></div>
<div id="sns20170324f1250updownslower"></div>
<div id="sns20170324f1250left"></div>
<div id="sns20170324f1250right"></div>
<div id="sns20170324f1250leftrightfaster"></div>
<div id="sns20170324f1250leftrightslower"></div>
<div id="sns20170324f1250plus"></div>
<div id="sns20170324f1250minus"></div>
<div id="sns20170324f1250plusminusfaster"></div>
<div id="sns20170324f1250plusminusslower"></div>

<style>
#sns20170324f1250up {position:absolute;left:0%;top:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250down {position:absolute;left:0%;bottom:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250updownfaster {position:absolute;left:20%;top:20%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250updownslower {position:absolute;left:20%;bottom:20%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250left {position:absolute;left:40%;top:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250right {position:absolute;left:40%;bottomm:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250leftrightfaster {position:absolute;left:60%;top:20%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250leftrightslower {position:absolute;left:60%;bottom:20%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250plus {position:absolute;right:0%;top:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250minus {position:absolute;right:0%;bottom:0%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250plusminusfaster {position:absolute;right:20%;top:20%;width:20%;height:20%;background-color:lightgrey}
#sns20170324f1250plusminusslower {position:absolute;right:20%;bottom:20%;width:20%;height:20%;background-color:lightgrey}
</style>



</div>


<div style="position:absolute;left:100px;top:50px;width:200px;height:100px;background-color:pink">


<div style="position:absolute;left:0%;top:0%;width:10%;height:30%;background-color:lightgrey"></div>
<div style="position:absolute;left:30%;top:20%;width:10%;height:20%;background-color:lightgrey"></div>
<div style="position:absolute;left:50%;top:0%;width:10%;height:30%;background-color:lightgrey"></div>






</div>


*

No comments:

Post a Comment