2

これが私が使用しているコードです。リンクの下に画像を表示するタスクは実行できますが、ドラッグできません。このスクリプトは、ワンクリックで画像スパンを表示し、2回目のクリックで画像スパンを閉じるタスクを実行します。私が欲しいのは、ワンクリックでドラッグ可能にそれらを表示することです。

<script type="text/javascript">
$(document).ready(function () {

    $(".slidingDiv").hide();
    $(".show_hide").show();


    $('.show_hide').click(function () {
        var el = $(this);
        var slidingDiv = el.find("span.slidingDiv");
        $(".slidingDiv" ).draggable();

        if (slidingDiv.length > 0) {
            slidingDiv.slideToggle(function () { el.after(slidingDiv); });
        }
        else {
            slidingDiv = el.next("span.slidingDiv");
            el.append(slidingDiv);
            slidingDiv.slideToggle();
        }
        return false;
    });
    $('.show_hide_close').click(function () {
        $(this).parent().parent("a.show_hide").click();
        return false;
    });
});

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

</script>

HTML：

<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a href="#" class="show_hide" style="position: relative;">Japan</a><span class="slidingDiv"><img src="02-1 ImageFiles/01 Japan.JPG" style="width:235px; height:245px;" /><a href="#" class="show_hide_close">Close</a></span> is made up of islands,
4

1 に答える 1

4

次の例を使用できます。

単純な場合： Link1 コード：

$(".selector").draggable({
    cancel: "button"
});​

もう少し：Link2 Link3

ディープの場合：Link4

于 2013-01-04T13:58:09.420 に答える