Notice: Undefined variable: root in /users/basti1012/www/index1.php on line 41
[gelöst] mit css animiertes objekt lokalisieren

[gelöst] mit css animiertes objekt lokalisieren

Hi 2 all. Stehe ich auf dem Schlauch oder ist es nicht möglich die aktuelle Position zu ermitteln bei einem durch CSS animierten Objektes.

Der hier verwendete Code

<script src="/js_webseite/jquery.js"></script> <style> #info{ width:25vw; height:100px; margin:0 auto; margin-top:200px; border:1px solid red; } #hg{ height:100px; width:100px; position:absolute; top:0px; left:0px; animation:los 7s linear infinite; } @keyframes los{ 0%,100%{ position:absolute; left:2px; top:0px; } 25%{ position:absolute; top:2px; left:calc(100% - 100px); } 50%{ position:absolute; top:calc(100% - 100px); left:calc(100% - 102px); } 75%{ position:absolute; left:0; top:calc(100% - 102px); } } </style> <body> <div id="info"></div> <img id='hg' src="/image/kermit_.jpg"> <script> setInterval(function(){ ff=$('#hg').position(); l=ff.left; t=ff.top; $('#info').html('Top = '+t.toFixed(2)+' Px<br>Left = '+l.toFixed(2)+' Px'); },100) </script> </body>