Aktuelle Zeit: 22. Sep 2018 23:34  


  User Information

Guest Avatar




Facebook, Google Login
Registrierung

  Hot Links



  Foren Kategorien








Ein neues Thema erstellen Auf das Thema antworten  [ 1 Beitrag ] 
AbonnentenAbonnenten: 0
LesezeichenLesezeichen: 0
Zugriffe: 136

 [JAVA] Jumpball 
AutorNachricht
FkP Moderator
Benutzeravatar

Registriert: 03.2014
Beiträge: 123
Geschlecht: männlich
Highscores: 2
Beitrag [JAVA] Jumpball
Zeigt einen hüpfenden Ball bzw lässt diesen Ball über die Seite hüpfen.

Code:
<head>
      <title>Ballsimulation</title>
      <script language="JavaScript">
<!--

/************Copyright by Jan Hörsch*****************/

var form;

var xvel,yvel;   // Geschwindigkeit in x- und y-Achse
var x,y;   // Koordinaten

var wirkungsgrad = 0.7; // Elastizitaet des Balles
var max_y = 450;   // unterer Rand
var min_x = 18;      // linker Rand
var max_x = 400;   // rechter Rand

var reibung_roll = 0.975 // Reibung beim rollen
var reibung_flug = 0.99  // Reibung beim flug

var running = 0;   // Bei running = 0 wird die Animation angehalten

function starte(){

      // Zuweisung der Variablen aus dem Formular
       xvel = form.xvel.value*1;
         yvel = form.yvel.value*1;
         x =   form.x.value*1;
         y = form.y.value*1;

      // Überprüfen, dass der Ball sich innerhalb der Spielfeldes befindet
      x = (x < min_x ? min_x : (x > max_x ? max_x : x));
      y = (y > max_y ? max_y : y);

      // Start der Animation
      running = 1;
      bewegen();
}

function bewegen(){

       yvel++; // Schwerkraft

       // Ball legt den "Frameweg" zurück
         x += xvel;
         y += yvel;

       // Ball dotzt auf dem Boden auf
        if(y >= max_y){
           yvel = Math.floor(yvel*wirkungsgrad);
           yvel = - yvel;
           y = max_y;
        }

        // Ball dotzt links und rechts weg
        if(x >= max_x) {
           xvel = - xvel;
           x = max_x;
        }
        else if (x <= min_x) {
              xvel = - xvel;
              x = min_x;
           }

        // Ballbewegung
         document.getElementById("ball").style.left = x;
         document.getElementById("ball").style.top = y;

         // Reibung: knapp über dem Boden stärker
         xvel = xvel * (y >= max_y-5 ? reibung_roll : reibung_flug)

         // Abgrenzung, um dem Script die Rechnerrei zu ersparen
         if(xvel > -0.1 && xvel < 0.1){ xvel = 0; }
     
       //
       document.getElementById("geschwindigkeit").innerHTML = Math.round(Math.sqrt(xvel*xvel + yvel*yvel)*100*100)/100 + " px/s";
     
         // Anzeigen Position und Geschwindigkeit des Balls
       form.xvel.value = xvel;
       form.yvel.value = yvel;
       form.x.value = x;
       form.y.value = y;

       // Solang der Ball nicht Bewegungslos am Boden liegt, wird der nächste Bewegungsschritt ausgeführt
       if((yvel != 0 || xvel != 0 || y != max_y) && running){
            window.setTimeout("bewegen()",10);
         }
}

function change(){
    // Prüfung, damit die Werte immer innerhalb des Spielfelds liegen
   if(form.x.value < min_x){
      form.x.value = min_x;
   }
   else if(form.x.value > max_x){
      form.x.value = max_x;
   }
   if(form.y.value > max_y){
      form.y.value = max_y;
   }

   // Zeichnen der neuen Position
    document.getElementById("ball").style.left = form.x.value;
    document.getElementById("ball").style.top  = form.y.value;
}
//-->
     </script>
     <style type="text/css">
<!--
input{
   border:1px solid black;
}
//-->
     </style>
</head>
<body onLoad="form = window.document.formular;" text="#000000" bgcolor="#FFFFFF">
      <form name="formular">
            <div id="ball" style="font-size:80px;position:absolute;top:88px;left:20px;">
                 o
            </div>
            <div style="border:1px solid black;border-top-style:dotted;position:absolute;top:120px;left:20px;width:417px;height:402px;"></div>
            <table border="0">
               <tr>
                  <td id="geschwindigkeit">e</td>
                  <th>x</th>
                  <th>y</th>
               </tr>
               <tr>
                  <th>Koordinaten</th>
                  <td><input type="text" name="x" value="20" onBlur="change()"></td>
                  <td><input type="text" name="y" value="88" onBlur="change()"></td>
               </tr>
               <tr>
                  <th>Geschwindigkeit</th>
                  <td><input type="text" name="xvel" value="10"></td>
                  <td><input type="text" name="yvel" value="0"></td>
               </tr>
               <tr>
                  <td align="right" colspan="3"><input type="button" value="Start" onClick="starte();">
                  <input type="button" value="Stop" onClick="running=0;">
                  <input type="reset" onClick="window.setTimeout('change()',10);"></td>
               </tr>
           </table>
      </form>
</body>
</html>

_________________
Bild
Bild
Bild


7. Apr 2014 13:43
Profil Besuche Website
Beiträge der letzten Zeit anzeigen:  Sortiere nach  
Ein neues Thema erstellen Auf das Thema antworten  [ 1 Beitrag ] 


Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 1 Gast


Du darfst keine neuen Themen in diesem Forum erstellen.
Du darfst keine Antworten zu Themen in diesem Forum erstellen.
Du darfst deine Beiträge in diesem Forum nicht ändern.
Du darfst deine Beiträge in diesem Forum nicht löschen.
Du darfst keine Dateianhänge in diesem Forum erstellen.

Suche nach:
Gehe zu:  
cron
© phpBB® Forum Software | designed by Vjacheslav Trushkin for Free Forums 3 & Free Forums/DivisionCore.
phpBB3 Forum von phpBB8.de