jsFiddle Code Not Working on Local Machine

2019-07-10 02:19发布

I am attempting to make an element move randomly inside a <div>

Thankfully, someone has found a solution which can be found here

However, when I run it on my local machine OR on a server, the element does not move.

Here is my source code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>

<style type="text/css">
div.a {
    width: 50px;
    height:50px;
    background-color:red;
    position:fixed;    
}​
</style>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
    animateDiv();

});

function makeNewPosition(){

    // Get viewport dimensions (remove the dimension of the div)
    var h = $(window).height() - 50;
    var w = $(window).width() - 50;

    var nh = Math.floor(Math.random() * h);
    var nw = Math.floor(Math.random() * w);

    return [nh,nw];    

}

function animateDiv(){
    var newq = makeNewPosition();
    var oldq = $('.a').offset();
    var speed = calcSpeed([oldq.top, oldq.left], newq);

    $('.a').animate({ top: newq[0], left: newq[1] }, speed, function(){
      animateDiv();        
    });

};

function calcSpeed(prev, next) {

    var x = Math.abs(prev[1] - next[1]);
    var y = Math.abs(prev[0] - next[0]);

    var greatest = x > y ? x : y;

    var speedModifier = 0.1;

    var speed = Math.ceil(greatest/speedModifier);

    return speed;

}​
</script>
</head>

<body>
    <div class='a'></div>​
</body>
</html>

2条回答
SAY GOODBYE
2楼-- · 2019-07-10 02:59

Sorry for my bad english

i have idea for copy the full source code

steps

  1. click on the Share button

  2. copy the link of on 2 box Share full screen result

  3. then go that link(copy link). it show the result

  4. then right click, click the view frame source.

Now your source code show

then put on the exact link of the script src and css.

now your code work

查看更多
Lonely孤独者°
3楼-- · 2019-07-10 03:05

Opening in Chrome, I got an error:

Uncaught SyntaxError: Unexpected token ? 

It looks like there is a non-visible character after the ending brace in the javascript. Open with Notepad++ and delete the extra character.

I have seen this happen when you copy and paste directly from a fiddle.

查看更多
登录 后发表回答