0

様、

私の HTML ページには、画像と、その画像を時計回りと反時計回りに回転させるための 2 つのボタンがあります。また、その画像をドラッグ可能にする必要があります。ドラッグと回転の両方を行うためのコードがあります。

ドラッグには次の JavaScript を使用しました。

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript">
    $(function () {
        $('#Image1').draggable();
        $('#WaterMark').draggable();
    });
</script>

そして、回転には次の JavaScript を使用しました。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="http://jqueryrotate.googlecode.com/svn/trunk/jQueryRotate.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        var angle = 0;
        $('#btnRotCw').on('click', function () {
            angle += 2;
            $("#Image1").rotate(angle);
        });
        $('#btnRotAcw').on('click', function () {
            angle -= 2;
            $("#Image1").rotate(angle);
        });
    });
</script>

しかし、ここでは回転は起こっていません。

誰でも私を案内してください。前もって感謝します。

4

2 に答える 2

1

あなたのコードにエラーはありません。私はこれと一緒に働くフィドルを含めました。
これが実用的なフィドルです

$(function () {
        $('#image').draggable();
        $('#image1').draggable();
});

$(document).ready(function () {
        var angle = 0;
        $('#button1').on('click', function () {
            angle += 2;
            $("#image").rotate(angle);
        });
        $('#button2').on('click', function () {
            angle -= 2;
            $("#image").rotate(angle);
        });
    });
于 2014-01-14T07:15:44.190 に答える
0

あなたのHTMLコードまたはあなたが私たちに見せていない何かに問題があるに違いありません. 以下は、コードが期待していることを実行する実用的なフィドルです。

働くフィドル

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="http://jqueryrotate.googlecode.com/svn/trunk/jQueryRotate.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        var angle = 0;
        $('#btnRotCw').on('click', function () {
            angle += 2;
            $("#Image1").rotate(angle);
        });
        $('#btnRotAcw').on('click', function () {
            angle -= 2;
            $("#Image1").rotate(angle);
        });
        $('#Image1').draggable();
    });
</script>

互いに競合するため、jQuery の 2 つの個別のインスタンスをロードすることは避けてください。

于 2013-08-28T07:55:53.457 に答える