如何使用 JQuery 拖动移动图像？

Question

你好，我是 JQuery 或 java 的新手，实际上我是编程新手！！！我完成了 jQUERY 的基础教程并使用 Jquery 制作了一个游戏。我被困在一件事上，也不确定我的代码是否正确这是我的代码..

var b = function($b, speed) {
    var beeWidth = $b.width();

    $b.animate({
        "right": "90%",
        "left": "90%"
    }, speed, function() {
        $b.animate({
            "left": 0 - beeWidth + "px"
        }, speed, function() {
            b($b, speed);
        });
    });

};
$(function() {
    b($("#b"), 5000);
    b($("#bOne"), 4500);
    b($("#bTwo"), 4000);
    b($("#bThree"), 3500);
    b($("#bfour"), 3000);
    b($("#bfive"), 2500);
    b($("#bsix"), 2000);
    b($("#bseven"), 1500);
});

body * {
  display: block;
}
body {
    background-image: url("...");
}

img{
  width: 150px;
  height: 75px;
  position:relative;
  display:inline-grid;
}

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<img id="b" src="http://www.clker.com/cliparts/s/o/o/A/x/F/bee-md.png">
<img id="bOne" src="http://www.clker.com/cliparts/s/o/o/A/x/F/bee-md.png">
<img id="bTwo" src="http://www.clker.com/cliparts/s/o/o/A/x/F/bee-md.png">
<img id="bThree" src="http://www.clker.com/cliparts/s/o/o/A/x/F/bee-md.png">
<img id="bfour" src="http://www.clker.com/cliparts/s/o/o/A/x/F/bee-md.png">
<img id="bfive" src="http://www.clker.com/cliparts/s/o/o/A/x/F/bee-md.png">
<img id="bsix" src="http://www.clker.com/cliparts/s/o/o/A/x/F/bee-md.png">
<img id="bseven" src="http://www.clker.com/cliparts/s/o/o/A/x/F/bee-md.png">

Answer 1

是的，你可以！你应该只使用 jQuery UI .

$(function(){
  $( "#draggable" ).draggable();
});

#draggable{
  width: 100px;
  height: 100px;
  background: #000;
  color: #FFF
}

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<div id="draggable">
  I AM DRAGGABLE
</div>

如何使用 JQuery 拖动移动图像？

How can i drag a moving image using JQuery?

html

javascript

css

jquery

draggable