通过拖拽改变图片大小

举报
AlbertYang 发表于 2021/02/02 22:59:52 2021/02/02
【摘要】 <!doctype html><html lang="en">    <head>        <meta charset="utf-8">        <title>通过拖拽改变图片大小</title>        <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery...

  
  1. <!doctype html>
  2. <html lang="en">
  3.     <head>
  4.         <meta charset="utf-8">
  5.         <title>通过拖拽改变图片大小</title>
  6.         <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
  7.         <style>
  8.             #resizable {
  9.                 width: 100px;
  10.                 height: 100px;
  11.                 background: #ccc;
  12.                 margin: auto;
  13.             }
  14.             #resizable img {
  15.                 height: 100%;
  16.                 width: 100%;
  17.             }
  18.         </style>
  19.         <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
  20.         <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
  21.     </head>
  22.     <body>
  23.         <div id="content">
  24.             <div id="resizable">
  25.                 <img src="img/national.7c84175e.png" />
  26.             </div>
  27.         </div>
  28.         <script>
  29.             $("#resizable").resizable();
  30.         </script>
  31.     </body>
  32. </html>

 

文章来源: albertyang.blog.csdn.net,作者:Albert Yang,版权归原作者所有,如需转载,请联系作者。

原文链接:albertyang.blog.csdn.net/article/details/105284699

【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。