»
AnglaisFran�aisVietnamien

Imprimer - Movable Calculatrice - JavaScriptBank.com

Version compl�te: jsB@nk » Calcul » Calculatrice » Movable Calculatrice
URL: https://www.javascriptbank.com/movable-calculator.html

Movable Calculatrice © JavaScriptBank.comCet JavaScript fait une base dragable calculatrice.

Version compl�te: jsB@nk » Calcul » Calculatrice » Movable Calculatrice
URL: https://www.javascriptbank.com/movable-calculator.html



CSS
<style type="text/css"><!--body div#tab {      height:20px;      width:150px;border:2px outset white;position:absolute;cursor:move  }body div#marker {    background-color:black;color:white;height:200px;width:150px;border:2px outset white;position:absolute }body span#screen {   background-color:darkblue;color:lightyellow;height:20px;width:130px;position:relative; }body a.button {   border:2px outset white; background-color:darkblue;    color:white; cursor:hand; height:20px; width:45px; text-decoration:none; font-weight:bold; position:relative }body a:hover{    background-color:red; color:white;}--></style><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<script language="JavaScript" type="text/javascript"><!--var down=false;var first;var buffer="";var toggle=false;var func=new Array("*","/","+","-",".");window.onload=main;if(navigator.appName=="Netscape")  window.document.captureEvents(event.MOUSEMOVE);function MDown(){  down=true;}function MUp(){  down=false;document.getElementById('unsel').select();}function MMove(e){ if(down){  document.getElementById('tab').style.left=(navigator.appName=="Netscape")?e.PageX:event.clientX;  document.getElementById('tab').style.top=(navigator.appName=="Netscape")?e.PageY:event.clientY;document.getElementById('marker').style.left=(navigator.appName=="Netscape")?e.PageX:event.clientX;document.getElementById('marker').style.top=(navigator.appName=="Netscape")?e.PageY+20:event.clientY+20;}}function main(){ if(navigator.appName=="Netscape") {   with(document.getElementById('tab').style) {    zIndex=1;top:0+"px";backgroundColor="transparent"; }   with(document.getElementById('marker').style) {  zIndex=0;  width=300+"px";  top=20+"px"; } } for(var x=-1;x<9;x++)   creatButtons(x,true,""); creatBR();creatBR(); for(var x=0,y=9;x<func.length;x++,y++)   creatButtons(y,false,func[x]);  creatPerc(); creatBR();creatBR(); creatSQRT(); creatPOW(); creatEnter(); creatCLS(); creatBK();  window.document.onmouseup=MUp;window.document.onmousemove=MMove;}function creatButtons(IDNo,num,txt){   a=document.createElement('a'); a.id="aid"+IDNo; a.className="button"; if(navigator.appName=="Netscape")   a.innerHTML=(num==true)?"<b style='visibility:hidden'>_</b>"+(IDNo+1)+"<b style='visibility:hidden'>_</b>":"<b style='visibility:hidden'>_</b>"+txt+"<b style='visibility:hidden'>_</b>"; else     a.innerHTML=(num==true)?(IDNo+1):txt; a.href="javascript:sendKey("+IDNo+","+num+")"; document.getElementById('marker').appendChild(a);} function creatSQRT(){  a=document.createElement('a');a.className="button";  a.innerHTML=navigator.appName=="Netscape"?"<b style='visibility:hidden;'>_</b>SQRT<b style='visibility:hidden;'>_</b>":"SQRT";a.href="javascript:_SQRT()";document.getElementById('marker').appendChild(a);}function creatPOW(){  a=document.createElement('a');a.className="button";  a.innerHTML=navigator.appName=="Netscape"?"<b style='visibility:hidden;'>_</b>POW<b style='visibility:hidden;'>_</b>":"POW";a.href="javascript:_POW()";document.getElementById('marker').appendChild(a);}function creatPerc(){  a=document.createElement('a');a.className="button";  a.innerHTML=navigator.appName=="Netscape"?"<b style='visibility:hidden;'>_</b>%<b style='visibility:hidden;'>_</b>":"%";a.href="javascript:_Perc()";document.getElementById('marker').appendChild(a);}function creatEnter(){  a=document.createElement('a');a.className="button";  a.innerHTML=navigator.appName=="Netscape"?"<b style='visibility:hidden;'>_</b>=<b style='visibility:hidden;'>_</b>":"=";a.href="javascript:ALU("+toggle+")";document.getElementById('marker').appendChild(a);}function creatCLS(){  a=document.createElement('a');a.className="button";  a.innerHTML=navigator.appName=="Netscape"?"<b style='visibility:hidden;'>_</b>CLS<b style='visibility:hidden;'>_</b>":"CLS";a.href="javascript:CLS()";document.getElementById('marker').appendChild(a);}function creatBK(){  a=document.createElement('a');a.className="button";  a.innerHTML=navigator.appName=="Netscape"?"<b style='visibility:hidden;'>_</b>BKSP<b style='visibility:hidden;'>_</b>":"BKSP";a.href="javascript:BK()";document.getElementById('marker').appendChild(a);}function creatBR(){  br=document.createElement('br');document.getElementById('marker').appendChild(br);}function sendKey(IDNo,num){     switch(IDNo) {     case 9:   temp=func[0];   break; case 10:   temp=func[1];   break; case 11:   temp=func[2];   break; case 12:   temp=func[3];   break; case 13:   temp=func[4];   break; default:   temp=IDNo+1; temp.toString();  } buffer+=temp;   document.getElementById('screen').innerHTML=buffer;}function ALU(){ if(toggle) {  temp=Math.pow(eval(first),eval(document.getElementById('screen').innerHTML));toggle=false; } else {  temp=eval(document.getElementById('screen').innerHTML); } buffer=temp.toString(); document.getElementById('screen').innerHTML=temp;}function CLS(){  buffer="";toggle=false;  document.getElementById('screen').innerHTML="";}function BK(){  buffer=document.getElementById('screen').innerHTML.substring(0,document.getElementById('screen').innerHTML.length-1);document.getElementById('screen').innerHTML=buffer;}function _SQRT(){  temp=Math.sqrt(eval(document.getElementById('screen').innerHTML));  document.getElementById('screen').innerHTML=temp;buffer=temp.toString();}function _POW(){  toggle=true;  first=document.getElementById('screen').innerHTML;  document.getElementById('screen').innerHTML="";buffer="";}function _Perc(){  buffer="";  temp=eval(eval(document.getElementById('screen').innerHTML)/100);  document.getElementById('screen').innerHTML=temp;buffer=temp.toString();}//--></script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<div id="tab" onmousedown="MDown()" onmouseup="MUp()" style="z-index: 1; width: 300px; background-color: transparent; top: 0px;">~ Calculator ~</div><br>  <div id="marker" style="z-index: 0; width: 300px; top: 20px;"><br><span id="screen">346</span><br>  <a id="aid-1" class="button" href="javascript:sendKey(-1,true)">  <b style="visibility: hidden;">_</b>0  <b style="visibility: hidden;">_</b></a>  <a id="aid0" class="button" href="javascript:sendKey(0,true)">  <b style="visibility: hidden;">_</b>1  <b style="visibility: hidden;">_</b></a>  <a id="aid1" class="button" href="javascript:sendKey(1,true)">  <b style="visibility: hidden;">_</b>2  <b style="visibility: hidden;">_</b></a>  <a id="aid2" class="button" href="javascript:sendKey(2,true)">  <b style="visibility: hidden;">_</b>3  <b style="visibility: hidden;">_</b></a>  <a id="aid3" class="button" href="javascript:sendKey(3,true)">  <b style="visibility: hidden;">_</b>4  <b style="visibility: hidden;">_</b></a>  <a id="aid4" class="button" href="javascript:sendKey(4,true)">  <b style="visibility: hidden;">_</b>5  <b style="visibility: hidden;">_</b></a>  <a id="aid5" class="button" href="javascript:sendKey(5,true)">  <b style="visibility: hidden;">_</b>6  <b style="visibility: hidden;">_</b></a>  <a id="aid6" class="button" href="javascript:sendKey(6,true)">  <b style="visibility: hidden;">_</b>7  <b style="visibility: hidden;">_</b></a>  <a id="aid7" class="button" href="javascript:sendKey(7,true)">  <b style="visibility: hidden;">_</b>8  <b style="visibility: hidden;">_</b></a>  <a id="aid8" class="button" href="javascript:sendKey(8,true)">  <b style="visibility: hidden;">_</b>9  <b style="visibility: hidden;">_</b></a><br><br>  <a id="aid9" class="button" href="javascript:sendKey(9,false)">  <b style="visibility: hidden;">_</b>*  <b style="visibility: hidden;">_</b></a>  <a id="aid10" class="button" href="javascript:sendKey(10,false)">  <b style="visibility: hidden;">_</b>/  <b style="visibility: hidden;">_</b></a>  <a id="aid11" class="button" href="javascript:sendKey(11,false)">  <b style="visibility: hidden;">_</b>+  <b style="visibility: hidden;">_</b></a>  <a id="aid12" class="button" href="javascript:sendKey(12,false)">  <b style="visibility: hidden;">_</b>-  <b style="visibility: hidden;">_</b></a>  <a id="aid13" class="button" href="javascript:sendKey(13,false)">  <b style="visibility: hidden;">_</b>.  <b style="visibility: hidden;">_</b></a>  <a class="button" href="javascript:_Perc()">  <b style="visibility: hidden;">_</b>%  <b style="visibility: hidden;">_</b></a><br><br>  <a class="button" href="javascript:_SQRT()">  <b style="visibility: hidden;">_</b>SQRT  <b style="visibility: hidden;">_</b></a>  <a class="button" href="javascript:_POW()">  <b style="visibility: hidden;">_</b>POW  <b style="visibility: hidden;">_</b></a>  <a class="button" href="javascript:ALU(false)">  <b style="visibility: hidden;">_</b>=  <b style="visibility: hidden;">_</b></a>  <a class="button" href="javascript:CLS()">  <b style="visibility: hidden;">_</b>CLS  <b style="visibility: hidden;">_</b></a>  <a class="button" href="javascript:BK()">  <b style="visibility: hidden;">_</b>BKSP  <b style="visibility: hidden;">_</b></a></div></center><input type="text" id="unsel" style="position: absolute; left: -900px;" size="20"><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->