在JqueryUI中可拖动和调整大小的图像不起作用? [英] Draggable and resizable in JqueryUI for an image is not working?

查看:212
本文介绍了在JqueryUI中可拖动和调整大小的图像不起作用?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用下面的代码来拖动和调整图像的大小,

I used below code for dragging and resizing the image,

<!DOCTYPE html>
<html>
    <head lang="en">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/>

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

        $( "#img_content" ).draggable().resizable();

    });
    </script>
    </head>
    <body class='default'>       


<div class="demo">
<!--<div id="img_content" class="ui-widget-content">
    <p>Drag me around</p>
</div>-->

<img id="img_content" class="ui-widget-content" src="Tulips.jpg" />

</div>


    </body>
</html>

resizable正在正确运行.但拖动图像不起作用.如果我申请了div结构

resizable is working corretly. but dragging the image not working. if i applied for div structure

<div id="img_content" class="ui-widget-content">
        <p>Drag me around</p>
    </div>

工作正常.

如何实现图像标签的拖动和调整大小?

How do i implement drag and resize for image tag?

推荐答案

您应使用style="display:inline-block; 将图像包装到div 中,然后使div可拖动并使图像可调整大小. > 工作示例

You should wrap the image into a div with style="display:inline-block; and then make the div draggable and the image resizable. Working Example

这篇关于在JqueryUI中可拖动和调整大小的图像不起作用?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆