Multidesk.be » Forums » Webdevelopment & -scripting » browsertest

  • Pagina
  • 1 van 1
0 gasten lezen dit onderwerp.
^ Onderwerp geschreven door thekid op vrijdag 18 maart 2011 om 16:39:20.
thekid's avatar
Multiviteit: 5273
Moderator
na een hele tijd C# & vb.net had ik zin nog eens iets anders te maken

bij deze dus wat browser testjes zitten maken

eigenlijk houden ze niet veel in, gewoon wat javascript based animaties

bij mij draait chrome alles het vlots (zeker het vuurwerk wanneer er meerdere tegelijk ontploffen)

opmerken altijd welkom :)
CODE - html
  1. <html>
  2. <head>
  3.   <title>
  4.   Browser tests using Javascript
  5.   </title>
  6.   <style type="text/css">
  7.     html, body { width: 100%; height: 100%; margin: 0; padding: 0; }
  8.     .options
  9.     {
  10.       position: absolute;
  11.       display: block;
  12.       background-color: #666666;
  13.       padding: 5px;
  14.       top: 50%; margin-top: -280px;
  15.       left: 50%; margin-left: -320px;
  16.       border: solid #333333 1px;
  17.     }
  18.     .screen
  19.     {
  20.       display: block;
  21.       position: absolute;
  22.       background-color: #000000;
  23.       left: 50%; top: 50%; width: 640px; height: 480px; margin-left: -320px; margin-top: -240px;
  24.       border: solid #666666 2px;
  25.       overflow: hidden;
  26.     }
  27.     .star0
  28.     {
  29.       position: absolute; width: 1px; height: 1px; background-color: #777777; font-size: 1px;
  30.     }
  31.     .star1
  32.     {
  33.       position: absolute; width: 2px; height: 2px; background-color: #888888; font-size: 1px;
  34.     }
  35.     .star2
  36.     {
  37.       position: absolute; width: 3px; height: 3px; background-color: #999999; font-size: 1px;
  38.     }
  39.     .star3
  40.     {
  41.       position: absolute; width: 4px; height: 4px; background-color: #a0a0a0; font-size: 1px;
  42.     }
  43.     .star4
  44.     {
  45.       position: absolute; width: 5px; height: 5px; background-color: #b0b0b0; font-size: 1px;
  46.     }
  47.     .star5
  48.     {
  49.       position: absolute; width: 6px; height: 6px; background-color: #c0c0c0; font-size: 1px;
  50.     }
  51.     .star6
  52.     {
  53.       position: absolute; width: 7px; height: 7px; background-color: #d0d0d0; font-size: 1px;
  54.     }
  55.     .star7
  56.     {
  57.       position: absolute; width: 8px; height: 8px; background-color: #e0e0e0; font-size: 1px;
  58.     }
  59.     .star8
  60.     {
  61.       position: absolute; width: 9px; height: 9px; background-color: #f0f0f0; font-size: 1px;
  62.     }
  63.     .star9
  64.     {
  65.       position: absolute; width: 3px; height: 3px; background-color: #f0f000; font-size: 1px;
  66.     }
  67.   </style>
  68.   <script type="text/javascript">
  69.   var isRunning = 0,
  70.       intervalTime = 10,
  71.       currentAction = -1,
  72.       obj = new Array(),
  73.       defArraySize = 100,
  74.       maxFireworks = 25,
  75.       maxFirebolts = 50;
  76.      
  77.   var curScreen = null;
  78.  
  79.   function getScreen()
  80.   {
  81.     if (!curScreen)
  82.       curScreen = document.getElementById('screen');
  83.     return curScreen;
  84.   }
  85.  
  86.   function clearScreen()
  87.   {
  88.     if (!curScreen)
  89.       getScreen();
  90.      
  91.     if (curScreen && curScreen.childNodes)
  92.     {
  93.       while (curScreen.childNodes.length > 0)
  94.         {
  95.           curScreen.removeChild(curScreen.childNodes[0]);
  96.         }
  97.     }
  98.   }
  99.  
  100.   function createStar(x, y, s)
  101.   {
  102.           var el = document.createElement('div');
  103.           el.style.left = parseInt(x) + 'px';
  104.           el.style.top = parseInt(y) + 'px';
  105.           el.className = 'star' + parseInt(s);
  106.           el.innerHTML = '&nbsp;';
  107.           return el;
  108.   }
  109.  
  110.   function stopAction()
  111.   {
  112.     currentAction = -1; isRunning = 0;
  113.   }
  114.  
  115.   function resetAction()
  116.   {
  117.     clearScreen(); obj = new Array(); setAction(currentAction);
  118.   }
  119.  
  120.   function setAction(actionNo)
  121.   {
  122.     obj = null;
  123.     switch (parseInt(actionNo))
  124.     {
  125.       case 0:
  126.         // star field
  127.         obj = new Array();
  128.         for (var x = 0; x < defArraySize; x++)
  129.         {
  130.           var index = obj.length;
  131.           obj[index] = new Array(3);
  132.           obj[index][0] = Math.random() * 640;
  133.           obj[index][1] = Math.random() * 480;
  134.           obj[index][2] = parseInt(Math.random() * 9);
  135.           obj[index][3] = createStar(obj[index][0], obj[index][1], obj[index][2]);
  136.           getScreen().appendChild(obj[index][3]);
  137.         }
  138.         break;
  139.       case 1:
  140.         // Unused
  141.         break;
  142.       case 2:
  143.         // attraction
  144.         // attraction ball, all small objects will follow first object
  145.         obj = new Array();
  146.         obj[0] = new Array();
  147.         obj[0][0] = Math.random() * 640;
  148.         obj[0][1] = Math.random() * 480;
  149.         obj[0][2] = createStar(obj[0][0], obj[0][1], 9);
  150.         obj[0][3] = 0;  // current moving speed x (we don't want it jumping around everywhere)
  151.         obj[0][4] = 0;  // current moving speed y (we don't want it jumping around everywhere)
  152.         getScreen().appendChild(obj[0][2]);
  153.         obj[1] = new Array();
  154.  
  155.         // the rest
  156.         for (var x = 0; x < defArraySize; x++)
  157.         {
  158.                 var index = obj[1].length;
  159.                 obj[1][index] = new Array();
  160.                 obj[1][index][0] = Math.random() * 640;
  161.                 obj[1][index][1] = Math.random() * 480;
  162.                 obj[1][index][2] = 0;         // current x speed
  163.                 obj[1][index][3] = 0;         // current y speed
  164.                 obj[1][index][4] = parseInt(Math.random() * 9);
  165.                 obj[1][index][5] = createStar(obj[1][index][0], obj[1][index][1], obj[1][index][4]);
  166.                 getScreen().appendChild(obj[1][index][5]);
  167.         }
  168.         break;
  169.       case 3:
  170.         // fireworks
  171.         // uses a starting point (x, y) to define start
  172.         // set speedleft / speedup (when both abs(<) 0.5 go boom)
  173.         // creates a default exploding plume with base coordinates sticking to
  174.         // original point in space (so it kinda falls along with the original boom)
  175.         // uses 72 points on a circle to emitt he boom (speed varies)
  176.         // up to 5 explosions simultanious
  177.         // bolts have a weight which is descreased as the explosion continues (9 - 0)
  178.         // when all bolts are 0, a new plume is created
  179.         obj = new Array();
  180.         for (var x = 0; x < maxFireworks; x++)
  181.         {
  182.                 obj[x] = new Array();
  183.                 obj[x][0] = Math.random() * 640;
  184.                 obj[x][1] = 480;
  185.                 obj[x][2] = Math.random() * 10 - Math.random() * 10;
  186.                 obj[x][3] = -(10 + (Math.random() * 10));
  187.                 obj[x][4] = 0; // has exploded?
  188.                 obj[x][5] = createStar(obj[x][0], obj[x][1], 9);
  189.                 getScreen().appendChild(obj[x][5]);
  190.                 // plume
  191.                 obj[x][6] = new Array();
  192.                 var steps = 5;
  193.                 var angleSize = 360 / maxFirebolts;
  194.                 for (var z = 0; z < steps; z++)
  195.                 {
  196.                         for (var y = 0; y < 360; y+=angleSize)
  197.                         {
  198.                                 var i = obj[x][6].length;
  199.                                 obj[x][6][i] = new Array();
  200.                                 obj[x][6][i][0] = Math.sin(DegreeToRad(y)) * (z + 1) * 3; // away movement velocity x
  201.                                 obj[x][6][i][1] = Math.cos(DegreeToRad(y)) * (z + 1) * 3; // away movement velocity y
  202.                                 obj[x][6][i][2] = parseInt(Math.random() * (z * 2)) + 1;
  203.                                 obj[x][6][i][3] = createStar(obj[x][0], obj[x][1], obj[x][6][i][2]);
  204.                                 obj[x][6][i][4] = obj[x][0]; // real x pos
  205.                                 obj[x][6][i][5] = obj[x][1]; // real y pos
  206.                                 getScreen().appendChild(obj[x][6][i][3]);
  207.                         }
  208.                 }
  209.                 obj[x][7] = 9;
  210.                 obj[x][8] = Math.random() * 500;        // delay :)
  211.         }
  212.         break;
  213.     }
  214.  
  215.     currentAction = actionNo;
  216.     isRunning = 1;
  217.     loopAction();
  218.   }
  219.  
  220.   var degreeTrans = Math.PI / 180.0;
  221.  
  222.   function DegreeToRad(degree)
  223.   {
  224.           return parseFloat(degreeTrans * degree);
  225.   }
  226.  
  227.   function loopAction()
  228.   {
  229.     switch (currentAction)
  230.     {
  231.       case 0:
  232.         // star field
  233.         for (var x = 0; x < obj.length; x++)
  234.         {
  235.           if (obj[x] && obj[x][3])
  236.           {
  237.             obj[x][0] += parseInt(obj[x][2]);
  238.             if (parseInt(obj[x][0]) > parseInt(curScreen.offsetWidth))
  239.               obj[x][0] = 0;
  240.              
  241.             obj[x][3].style.left = obj[x][0] + 'px';
  242.           }
  243.         }
  244.         break;
  245.       case 1:
  246.         // Unused
  247.         break;
  248.       case 2:
  249.         // attraction
  250.  
  251.         // change speed coordinates     
  252.         obj[0][3] += (Math.random() * (Math.random() * 2)) - (Math.random() * (Math.random() * 2));
  253.         while (Math.abs(parseInt(obj[0][3])) > 9)
  254.                 obj[0][3] += parseInt(obj[0][3]) > 0 ? -1 : +1;
  255.         obj[0][4] += (Math.random() * (Math.random() * 2)) - (Math.random() * (Math.random() * 2));
  256.         while (Math.abs(parseInt(obj[0][4])) > 9)
  257.                 obj[0][4] += parseInt(obj[0][4]) > 0 ? -1 : +1;
  258.  
  259.         // update location of the ball
  260.         obj[0][0] += parseInt(obj[0][3]);
  261.         obj[0][1] += parseInt(obj[0][4]);
  262.         if (parseInt(obj[0][0]) < 0)
  263.                 obj[0][0] += 640;
  264.         if (parseInt(obj[0][0]) > 640)
  265.                 obj[0][0] -= 640;
  266.         if (parseInt(obj[0][1]) < 0)
  267.                 obj[0][1] += 480;
  268.         if (parseInt(obj[0][1]) > 480)
  269.                 obj[0][1] -= 480;
  270.  
  271.         obj[0][2].style.left = parseInt(obj[0][0]) + 'px';
  272.         obj[0][2].style.top = parseInt(obj[0][1]) + 'px';
  273.  
  274.         // try to let the balls move fluently versus the attraction globe
  275.         // don't care for them to go out of bounds, like this they need to swim a little :)
  276.        
  277.         var targetX = parseFloat(obj[0][0]),
  278.             targetY = parseFloat(obj[0][1]);
  279.  
  280.         for (var x = 0; x < obj[1].length; x++)
  281.         {
  282.                 var curX = obj[1][x][0], curY = obj[1][x][1], movX = parseFloat(obj[1][x][2]), movY = parseFloat(obj[1][x][3]), weight = (9 - parseFloat(obj[1][x][4])) + 1;
  283.                
  284.                 if (curX < targetX)
  285.                 {
  286.                         movX = movX < 0 ?
  287.                                 (movX < -.5 ? movX * .9 : .5) :
  288.                                 (movX > 0 ? movX * 1.10 : -.5);
  289.                 }
  290.                 else
  291.                 {
  292.                         if (curX > targetX)
  293.                         {
  294.                                 movX = movX > 0 ? (movX > .5 ? movX * .9 : -.5) : (movX < 0 ? movX * 1.10 : .5);
  295.                         }
  296.                 }
  297.                 if (curY < targetY)
  298.                 {
  299.                         movY = movY < 0 ?
  300.                                 (movY < -.5 ? movY * .9 : .5) :
  301.                                 (movY > 0 ? movY * 1.10 : -.5);
  302.                 }
  303.                 else
  304.                 {
  305.                         if (curY > targetY)
  306.                         {
  307.                                 movY = movY > 0 ? (movY > .5 ? movY * .9 : -.5) : (movY < 0 ? movY * 1.10 : .5);
  308.                         }
  309.                 }
  310.                
  311.                 if (Math.abs(movX) > weight * 3)
  312.                         movX = movX > 0 ? -weight : weight;
  313.                 if (Math.abs(movY) > weight * 3)
  314.                         movY = movY > 0 ? -weight : weight;
  315.  
  316.                 obj[1][x][2] = movX;
  317.                 obj[1][x][3] = movY;
  318.                
  319.                 obj[1][x][0] += parseFloat(obj[1][x][2]);
  320.                 obj[1][x][1] += parseFloat(obj[1][x][3]);
  321.  
  322.                 obj[1][x][5].style.left = parseInt(obj[1][x][0]) + 'px';
  323.                 obj[1][x][5].style.top = parseInt(obj[1][x][1]) + 'px';
  324.         }
  325.  
  326.  
  327.         break;
  328.       case 3:
  329.         // fireworks
  330.         // move the plume up and horizontally
  331.         // if movx & movy are abs(<0) then it's explosion time
  332.         // as long as the explosion didn't occure, the plume moves together with the rest
  333.         // from on then, it works with its own coordinates and expansion rates
  334.         for (var x = 0; x < obj.length; x++)
  335.         {
  336.                 if (obj[x][4] != 0)
  337.                 {
  338.                         // explosion has occured
  339.                         obj[x][2] *= .9;
  340.                         obj[x][3] *= 1.1;
  341.                         obj[x][0] += obj[x][2];
  342.                         obj[x][1] += obj[x][3];
  343.                        
  344.                         // reset glower
  345.                         obj[x][5].style.left = parseInt(obj[x][0]) + 'px';
  346.                         obj[x][5].style.top = parseInt(obj[x][1]) + 'px';
  347.                         if (parseInt(obj[x][7]) >= 1)
  348.                         {
  349.                                 obj[x][7] -= .25;
  350.                                 obj[x][5].className = 'star' + parseInt(obj[x][7]);
  351.                         }
  352.                        
  353.                         // perform single explosion loop
  354.                         // every point is increased with explosion details
  355.                         // after every 2 loops, their weight goes down (and so does their cssclass)
  356.                         // in case non are bigger than 1 = 0, finished, and we can remove plume and firework item
  357.                         var movecount = 0;
  358.                         for (var y = 0; y < obj[x][6].length; y++)
  359.                         {
  360.                                 if (parseInt(obj[x][6][y][2]) >= 1)
  361.                                 {
  362.                                         movecount++;
  363.                                        
  364.                                         // first move together with the plume
  365.                                         obj[x][6][y][4] += obj[x][2];
  366.                                         obj[x][6][y][5] += obj[x][3];
  367.                                        
  368.                                         // and execute the current explosion effect
  369.                                         obj[x][6][y][0] *= .9;
  370.                                         obj[x][6][y][1] *= .9;
  371.                                         obj[x][6][y][4] += obj[x][6][y][0];
  372.                                         obj[x][6][y][5] += obj[x][6][y][1];
  373.  
  374.                                         obj[x][6][y][3].style.left = parseInt(obj[x][6][y][4]) + 'px';
  375.                                         obj[x][6][y][3].style.top = parseInt(obj[x][6][y][5]) + 'px';
  376.                                        
  377.                                         obj[x][6][y][2] -= .33;
  378.                                         obj[x][6][y][3].className = 'star' + parseInt(obj[x][6][y][2]);
  379.                                         if (parseInt(obj[x][6][y][2]) < 1)
  380.                                         {
  381.                                                 getScreen().removeChild(obj[x][6][y][3]);
  382.                                         }
  383.                                 }
  384.                         }
  385.                         if (movecount == 0)
  386.                         {
  387.                                 // recreate this firework item
  388.                                 // recreate plume
  389.                                 getScreen().removeChild(obj[x][5]);
  390.  
  391.                                 obj[x] = new Array();
  392.                                 obj[x][0] = Math.random() * 640;
  393.                                 obj[x][1] = 480;
  394.                                 obj[x][2] = Math.random() * 4 - Math.random() * 4;
  395.                                 obj[x][3] = -(10 + (Math.random() * 10));
  396.                                 obj[x][4] = 0; // has exploded?
  397.                                 obj[x][5] = createStar(obj[x][0], obj[x][1], 9);
  398.                                 getScreen().appendChild(obj[x][5]);
  399.                                 // plume
  400.                                 obj[x][6] = new Array();
  401.                                 var steps = 5;
  402.                                 var angleSize = 360 / maxFirebolts;
  403.                                 for (var z = 0; z < steps; z++)
  404.                                 {
  405.                                         for (var y = 0; y < 360; y+=angleSize)
  406.                                         {
  407.                                                 var i = obj[x][6].length;
  408.                                                 obj[x][6][i] = new Array();
  409.                                                 obj[x][6][i][0] = Math.sin(DegreeToRad(y)) * (z + 1) * 2; // away movement velocity x
  410.                                                 obj[x][6][i][1] = Math.cos(DegreeToRad(y)) * (z + 1) * 2; // away movement velocity y
  411.                                                 obj[x][6][i][2] = parseInt(Math.random() * (z * 2)) + 1;
  412.                                                 obj[x][6][i][3] = createStar(obj[x][0], obj[x][1], obj[x][6][i][2]);
  413.                                                 obj[x][6][i][4] = obj[x][0]; // real x pos
  414.                                                 obj[x][6][i][5] = obj[x][1]; // real y pos
  415.                                                 getScreen().appendChild(obj[x][6][i][3]);
  416.                                         }
  417.                                 }
  418.                                 obj[x][7] = 9;
  419.                                 obj[x][8] = Math.random() * 500;        // delay :)
  420.                         }
  421.                 }
  422.                 else
  423.                 {
  424.                         if (parseInt(obj[x][8]) <= 0)
  425.                         {
  426.                                 // no explosion yet
  427.                                 obj[x][2] *= .90;
  428.                                 obj[x][3] *= .90;
  429.                                 if (Math.abs(obj[x][2]) <= 1 && Math.abs(obj[x][3]) <= 1)
  430.                                 {
  431.                                         obj[x][4] = 1; // explode!
  432.                                         obj[x][3] = .5;
  433.                                 }
  434.                                 obj[x][0] += obj[x][2];
  435.                                 obj[x][1] += obj[x][3];
  436.                                 obj[x][5].style.left = parseInt(obj[x][0]) + 'px';
  437.                                 obj[x][5].style.top = parseInt(obj[x][1]) + 'px';
  438.                                 for (var y = 0; y < obj[x][6].length; y++)
  439.                                 {
  440.                                         obj[x][6][y][4] = obj[x][0]; // real x pos
  441.                                         obj[x][6][y][5] = obj[x][1]; // real y pos
  442.                                         obj[x][6][y][3].style.left = parseInt(obj[x][6][y][4]) + 'px';
  443.                                         obj[x][6][y][3].style.top = parseInt(obj[x][6][y][5]) + 'px';
  444.                                 }
  445.                         }
  446.                         else
  447.                         {
  448.                                 // delay before the bolt sets off
  449.                                 obj[x][8] -= parseFloat((Math.random() * 10 + 1) / 10.0);
  450.                         }
  451.                 }
  452.         }
  453.         break;
  454.     }
  455.     if (isRunning && currentAction >= 0)
  456.     {
  457.       var btn = document.getElementById('PauzeButton');
  458.       btn.style.disabled = 'false';
  459.       setTimeout('loopAction()', intervalTime);
  460.     }
  461.     else
  462.     {
  463.       var btn = document.getElementById('PauzeButton');
  464.       // screen
  465.       if (currentAction < 0)
  466.       {
  467.               btn.style.disabled = 'true';
  468.       }
  469.       else
  470.       {
  471.               btn.style.disabled = 'false';
  472.       }
  473.     }
  474.   }
  475.  
  476.   var tick = 0;
  477.  
  478.   function pauzeAction()
  479.   {
  480.           var btn = document.getElementById('PauzeButton');
  481.           isRunning = isRunning ? 0 : 1;
  482.           btn.value = isRunning ? 'Pauze' : 'Play';
  483.           loopAction();
  484.   }
  485.   </script>
  486. </head>
  487. <body>
  488.   <!-- responsible for all output :) -->
  489.   <div class="screen" id="screen">
  490.   </div>
  491.   <!-- responsible for changing javascript stuff -->
  492.   <div class="options">
  493.     <input type="button" id="StopButton" value="Stop" onclick="javascript:stopAction()" /> <input type="button" id="PauzeButton" value="Pauze" onclick="javascript:pauzeAction();" /> <input type="button" id="ResetButton" value="Reset" onclick="javascript:resetAction();" /> | <input type="button" id="btnStars" value="Star animation" onclick="javascript:setAction(0);" /> <input type="button" id="btnAttraction" value="Attraction" onclick="javascript:setAction(2);" /> <input type="button" id="btnFireworks" value="Fireworks" onclick="javascript:setAction(3);" />
  494.   </div>
  495. </body>
  496. </html>


code opslaan als een html bestand zou voldoende moeten zijn om deze kunnen laten runnen in een browser :)
"Human beings make life so interesting. Do you know, that in a universe so full of wonders, they have managed to invent boredom." - Death in Hogfather
^ Reactie #1 geschreven door StOosh op vrijdag 18 maart 2011 om 17:32:38.
StOosh's avatar
Multiviteit: 1526
In chrome geeft het inderdaad een erg mooi resultaat, maar Opera Safari en bovenal Ie geven een schokkerige en veel te snelle animatie.. :)

Wat is eigenlijk de bedoeling van zo'n browsertestje?
^ Reactie #2 geschreven door een gast op vrijdag 18 maart 2011 om 18:08:53.

Dixit

Dixit StOosh op 18/03/2011 17:32:38:

In chrome geeft het inderdaad een erg mooi resultaat, maar Opera Safari en bovenal Ie geven een schokkerige en veel te snelle animatie.. :)

Wat is eigenlijk de bedoeling van zo'n browsertestje?
Euh...je browser(snelheid) te testen?
^ Reactie #3 geschreven door thekid op vrijdag 18 maart 2011 om 20:36:12.
thekid's avatar
Multiviteit: 5273
Moderator
yup, wilde vooral eens kijken wat de IE9 vs de rest deed

eigenlijk draait ie ook heel vlot in IE9

'k heb ondertussen gezien dat er wel een foutje kan gebeuren wanneer je bvb tussen de acties wisselt, want ie stop de loop niet waardoor ie soms heeeeeel rap kan beginnen werken, in dat geval eens stop en reset klikken en dan zou de correcte snelheid terug moeten zijn :)
"Human beings make life so interesting. Do you know, that in a universe so full of wonders, they have managed to invent boredom." - Death in Hogfather
^ Reactie #4 geschreven door SMG op zaterdag 19 maart 2011 om 16:25:04.
SMG's avatar
Multiviteit: 12000
Moderator
Ik gebruik momenteel nog de beta van IE9 en bij mij komen de knoppen vanboven niet helemaal op het scherm.

http://www.multidesk.be/bijlage/e344926edf665e81d2b328a799450b01.png

Heb nu niet de finale versie van IE aan boord en heb momenteel geen zin om hem te installeren, maar is dit probleem van de baan?
^ Reactie #5 geschreven door thekid op zaterdag 19 maart 2011 om 16:53:44.
thekid's avatar
Multiviteit: 5273
Moderator
bizar ja, bij mij kwamen ze goed uit in alle browsers hoor
"Human beings make life so interesting. Do you know, that in a universe so full of wonders, they have managed to invent boredom." - Death in Hogfather
^ Reactie #6 geschreven door StOosh op maandag 21 maart 2011 om 19:13:30.
StOosh's avatar
Multiviteit: 1526
Bij mijn IE had ik dat ook.

Dixit

Dixit Gast op 18/03/2011 18:08:53:

Dixit

Dixit StOosh op 18/03/2011 17:32:38:

In chrome geeft het inderdaad een erg mooi resultaat, maar Opera Safari en bovenal Ie geven een schokkerige en veel te snelle animatie.. :)

Wat is eigenlijk de bedoeling van zo'n browsertestje?
Euh...je browser(snelheid) te testen?

_O_ Captain Obvious
Deze tekst werd het laatst bewerkt voor 91.03 % door StOosh op maandag 21 maart 2011 om 19:16:48.
^ Reactie #7 geschreven door een gast op maandag 21 maart 2011 om 19:54:40.

Dixit

[i][small]Dixit StOosh

_O_ Captain Obvious
Mijn gedacht toen ik je vraag las :P
^ Reactie #8 geschreven door StOosh op maandag 21 maart 2011 om 21:46:32.
StOosh's avatar
Multiviteit: 1526
Begrijpelijk, maar ik dacht dat er meer zou achter zitten. :p
^ Reactie #9 geschreven door een gast op dinsdag 22 maart 2011 om 12:07:54.

Dixit

Dixit StOosh op 21/03/2011 21:46:32:

Begrijpelijk, maar ik dacht dat er meer zou achter zitten. :p
When it looks like a duck, quacks like a duck ...
^ Reactie #10 geschreven door SMG op zondag 27 maart 2011 om 21:25:48.
SMG's avatar
Multiviteit: 12000
Moderator
Ondertussen met IE9 (final) aan het werk en wilde dit even terug testen en ik krijg nog steeds hetzelfde: ik kan enkel maar de knoppen attraction en fireworks zien.

IE9 - Win7 x64 SP1
^ Reactie #11 geschreven door thekid op maandag 28 maart 2011 om 14:43:54.
thekid's avatar
Multiviteit: 5273
Moderator
ja

ge hebt gelijk smg ('k heb het nu ook eens nagekeken)

blijkbaar doe ik iets mis met de .options in de styles vanboven in de pagina

ge kunt de margin-left: -x px afleggen, vermoedelijk gaat hij daar in de mist, dan gaan de knoppen op een beetje een andere plaats staan, maar tot daar aan toe :D
"Human beings make life so interesting. Do you know, that in a universe so full of wonders, they have managed to invent boredom." - Death in Hogfather
^ Reactie #12 geschreven door SMG op maandag 28 maart 2011 om 17:52:10.
SMG's avatar
Multiviteit: 12000
Moderator
Inderdaad, even de dev tools gebruikt om het correct te zetten. Margin left stond op -320px
  • Pagina
  • 1 van 1

Snel-antwoordformulier
Toon uitgebreid antwoordformulier Bericht nalezen Bericht plaatsen