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 回答