Facebook
From Bistre Peafowl, 3 Years ago, written in Plain Text.
Embed
Download Paste or View Raw
Hits: 50
  1. <DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.         <meta charset="UTF-8">
  5.         <title>Document</title>
  6. <style>
  7.         div
  8.         {
  9.         position:absolute;
  10.         width:100px;
  11.         height:100px;
  12.         border:5px solid black;
  13.         }
  14.         div img
  15.         {
  16.         width:100px;
  17.         height:100px;
  18.         }
  19. </style>
  20. <script>
  21.         function Generator()
  22.                 {
  23.                 var num=4, newdiv, divIdName;
  24.                 for(var i=0;i<num;i++)for(var j=0;j<num;j++)
  25.                         {
  26.                         newdiv=document.createElement('div');
  27.                         divIdName='a'+i+j;
  28.                         newdiv.setAttribute('id', divIdName);
  29.                         newdiv.style.top=100+100*j+'px';
  30.                         newdiv.style.left=100+100*i+'px';
  31.                         if(i*j!=9)
  32.                         newdiv.innerHTML="<img src='ragnaros_"+j+"_"+i+".png'>";
  33.                         newdiv.addEventListener('click', function(){ graj(this);});
  34.                         document.body.appendChild(newdiv);
  35.                         }
  36.                 }
  37.  
  38.         function graj(x)
  39.                 {
  40.                 var bufor;
  41.        
  42.                 if(x.style.top==a33.style.top&&
  43.                 (parseInt(x.style.left || 0)+100+'px'==a33.style.left||parseInt(x.style.left || 0)-100+'px'==a33.style.left))
  44.                         {
  45.                         bufor=x.style.left;
  46.                         x.style.left=a33.style.left;
  47.                         a33.style.left=bufor;
  48.                         }
  49.                 if(x.style.left==a33.style.left&&
  50.                 (parseInt(x.style.top || 0)+100+'px'==a33.style.top||parseInt(x.style.top || 0)-100+'px'==a33.style.top))
  51.                         {
  52.                         bufor=x.style.top;
  53.                         x.style.top=a33.style.top;
  54.                         a33.style.top=bufor;
  55.                         }
  56.                 }
  57.                 var TabId=['a00','a01','a02','a03','a10','a11','a12','a13','a20','a21','a22','a23','a30','a31','a32','a33'];
  58.                 var TabPos=[[100,100],[200,100],[300,100],[400,100],[100,200],[200,200],[300,200],[400,200],[100,300],[200,300],[300,300],[400,300],
  59.                         [100,400],[200,400],[300,400],[400,400]];
  60.         function mieszaj(){
  61.         var i=0, x;
  62.         var TabLos=[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1];
  63.             while(i<16)
  64.             {
  65.                 x=Math.floor(Math.random()*16);
  66.                 if(TabLos[x]==1)
  67.                 {
  68.                 document.getElementById(TabId[i]).style.left=TabPos[x][0]+'px';
  69.                 document.getElementById(TabId[i]).style.top=TabPos[x][1]+'px';
  70.                 i++;    
  71.                 TabLos[x]=0;
  72.                 }
  73.             }
  74.         }
  75. </script>
  76. </head>
  77. <body onload="Generator()">
  78.         <input type="button" value="mieszaj" onclick="mieszaj()">
  79. </body>