jsFiddle Code Not Working on Local Machine

2019-07-10 02:44发布

问题:

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>

回答1:

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.



回答2:

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