开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >问答首页 >Croppie不在弹出模式中工作

问Croppie不在弹出模式中工作
EN

Stack Overflow用户

提问于 2018-04-02 07:21:01

回答 1查看 1.1K关注 0票数 1

在弹出模型中，我使用Jquery 克罗皮来要求裁剪或缩放图像，在弹出模式中使用fancybox来显示图像，现在我想在弹出模式下制作裁剪图像或缩放图像，但它已经不再工作了。我做过弹出模式，

<a data-fancybox="gallery" href="{{ asset('public/img/noimage.png') }}" id="fancybox_anchor">
   <div id="profile_pic_div" style="background-image: url('{{ asset('public/img/noimage.png') }}')"></div>
</a>

弹出式模型很好地显示了图像，但现在我想用我曾经尝试过的鳄鱼来实现它的裁剪、缩放、尺寸调整，

$( '.fancybox-image-wrap img' ).croppie({
        enableExif: true,
        viewport: {
            width: 250,
            height: 250,
        },
        type: 'circle',
        boundary: {
            width: 300,
            height: 300
        }
});

当弹出打开时，Image类是fancybox-image-wrap，这就是为什么我把它作为选择器。在正常模式下，它可以工作，但如何在弹出模型中做到这一点。请帮帮忙。我完全被困在这里面了。

谢谢。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-04-03 22:27:24

下面是一个更完整的使用回调来初始化croppie并获得结果的示例：

var myCroopie;

$('[data-fancybox="images"]').fancybox({
  touch: false, 
  clickContent: false,
  animationEffect: false,
  afterLoad : function(instance, current) {
    myCroopie = current.$image.croppie({
    });
  },
  beforeClose : function() {
    myCroopie.croppie('result', 'html').then(function(html) {
      // html is div (overflow hidden)
      // with img positioned inside.
      $("#rez").html(html);
    });
  }
});

演示- https://codepen.io/anon/pen/bvjeLZ?editors=1010

票数 2

EN

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/49613929

复制

相关文章

HTTP中get和post

缓存 http php html

GET和POST本质上两者没有任何区别。他们都是HTTP协议中的请求方法。底层实现都是基于TCP/IP协议。上述的所谓区别，只是浏览器厂家根据约定，做得限制而已

小小咸鱼YwY

2019/09/11

9350

Android下通过HttpClient执行 HTTP POST 请求

android http post

Android下通过HttpClient执行 HTTP POST 请求 public void postData() { // Create a new HttpClient and Post Header HttpClient httpclient = new DefaultHttpClient(); HttpPost httppost = new HttpPost("http://www.yoursite.com/script.php"); try { //

用户7108768

2021/09/22

1.1K0

HTTP中GET与POST的区别？

HTTP POST 方法发送数据给服务器，数据类型由 Content-Type 指定。

Learn-anything.cn

2021/11/24

7550

HTTP中Get与Post的区别

php iis mvc http asp

Http定义了与服务器交互的不同方法，最基本的方法有4种，分别是GET，POST，PUT，DELETPHP

Java架构师必看

2020/10/16

1.6K0

Android入门之Http请求方式Get与Post

android http iis

前言：在Android开发的过程中，必须会接触到数据交互(访问数据,写入数据等你等),既然接触到数据的交互，那么自然而然就是使用通讯间的协议来进行请求，最常见的协议就是Http协议，Http协议包括两个具体的请求方式-Get以及Post。

AlicFeng

2019/02/22

6.8K0

Qt中实现http服务接收POST请求

qt http post 服务服务器

总体而言，HTTP服务器适用于传统的客户端-服务器通信，每次请求都需要重新建立连接，适合请求响应式的场景。WebSocket服务器适用于需要实时双向通信的场景，适合聊天应用、实时数据更新等。

Linux兵工厂

2023/09/15

1.6K0

Qt中实现http服务接收POST请求

如何在Firefox中配置HTTP？

http 爬虫代理服务器

在浏览器中配置HTTP是一个常见的需求，它可以让我们轻松访问需要的网站或保护个人隐私。本文将为您详细介绍如何在Firefox浏览器中配置HTTP应用，帮助您实现无缝的HTTP体验。无论您是初次接触HTTP还是有一定经验的用户，本文都能为您提供实用的操作步骤和示例代码。让我们一起来配置Firefox的HTTP吧！

华科云商小徐

2023/10/10

5930

python http post 登

访问管理编程算法

网站调戏 http://uugoc.com/login 账号 739639550 密码 123456 开始调戏谷歌浏览器 F12 j进入调戏模式输入账号密码

py3study

2020/01/06

6180

python http post 登

Http Post 快速使用

python http 打包 SSL 证书

点击上方蓝字可直接关注！方便下次阅读。如果对你有帮助，麻烦点个在看或点个赞，感谢~

用户5908113

2020/08/25

8780

http请求中get和post方法的区别

一般我们在浏览器输入一个网址访问网站都是GET请求;再FORM表单中，可以通过设置Method指定提交方式为GET或者POST提交方式，默认为GET提交方式。

用户7880705

2020/11/06

4.4K0

http中的get和post方法的区别

http 安全 post 浏览器协议

HTTPS和HTTP的区别主要如下：　　1、https协议需要到ca申请证书，一般免费证书较少，因而需要一定费用。　　2、http是超文本传输协议，信息是明文传输，https则是具有安全性的ssl加密传输协议。　　3、http和https使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。　　4、http的连接很简单，是无状态的；HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，比http协议安全。

魚迹

2023/05/06

6500

http中的get和post方法的区别

接口测试如何在post请求中传递文件

接口测试 file text 接口文件上传

2.找到body这个选项，输入文件对应的参数名，在然后把参数名后面的text选择为file。

sik1

2022/06/21

3.4K0

springboot发送http请求,springboot http post json

高久峰

2023/07/02

5550

HTTP协议中的GET、POST请求方法的区别

php 网站 http nginx

HTTP 请求方法有：HEAD、PUT、DELETE、OPTIONS、CONNECT

宣言言言

2019/12/15

4.7K0

HTTP 方法：GET 对比 POST

举例：客户端（浏览器）向服务器提交 HTTP 请求；服务器向客户端返回响应。响应包含关于请求的状态信息以及可能被请求的内容。

流柯

2018/08/30

7580

HTTP 方法：GET 对比 POST

两种最常用的 HTTP 方法是：GET 和 POST。什么是 HTTP？超文本传输协议（HTTP）的设计目的是保证客户机与服务器之间的通信。 HTTP 的工作方式是客户机与服务器之间的请求-应答协议。 web 浏览器可能是客户端，而计算机上的网络应用程序也可能作为服务器端。举例：客户端（浏览器）向服务器提交 HTTP 请求；服务器向客户端返回响应。响应包含关于请求的状态信息以及可能被请求的内容。两种 HTTP 请求方法：GET 和 POST 在客户机和服务器之间进行请求-响应时，两种最常被用到的方法

三哥

2018/06/27

7560

Android通过HTTP POST带參訪问asp.net网页

java asp.net https http 网络安全

在看了网络上非常多视频关于android通过HTTP POST或者GET方式訪问网页并获取数据的方法。

全栈程序员站长

2022/07/08

1.2K0

Android通过HTTP POST带參訪问asp.net网页

点击加载更多

相似问题

如何在android中通过http post发布web链接

21

Android上的HTTP Post Multipart不发布图像。

21

无法通过HTTP post发布

30

如何在vb.net中通过HTTP post发布文件

40

Android ICS HTTP POST

14

添加站长进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例