jCrop - 更新预览onload? [英] jCrop - update preview onload?

查看:88
本文介绍了jCrop - 更新预览onload?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用jCrop预览演示来做我自己的事情。但是我遇到了一个问题。如果我在使用 setSelect:加载图像时创建默认选择,那么我将选择映射到大图像上,但它不会出现在预览中。我无法找到一个api处理程序来在jCrop加载时调用updatePreview函数。有没有人知道如何在jCrop加载时调用这个函数?

I am using the jCrop preview demo to do my own thing. However I have run into a problem. If I create a default selection when the image loads using setSelect: then I have the selection mapped out on the big image but it doesn't appear on the preview. I cannot find an api handler to call the updatePreview function when jCrop loads. Does anyone know how to call this function when jCrop loads?

jQuery(function($){

      // Create variables (in this scope) to hold the API and image size
      var jcrop_api, boundx, boundy;

      $('#target').Jcrop({
        onChange: updatePreview,
        onSelect: updatePreview,
        setSelect: [ 0, 0, selectWidth, selectHeight ],
        aspectRatio: 1
      },function(){
        // Use the API to get the real image size
        var bounds = this.getBounds();
        boundx = bounds[0];
        boundy = bounds[1];
        // Store the API in the jcrop_api variable
        jcrop_api = this;
      });

      function updatePreview(c)
      {
        if (parseInt(c.w) > 0)
        {
          var rx = 100 / c.w;
          var ry = 100 / c.h;

          $('#preview').css({
            width: Math.round(rx * boundx) + 'px',
            height: Math.round(ry * boundy) + 'px',
            marginLeft: '-' + Math.round(rx * c.x) + 'px',
            marginTop: '-' + Math.round(ry * c.y) + 'px'
          });
        }
      };

    });


推荐答案

我试图设置默认值和默认值正在预览框中预览。

I tried to set the default value and the default value is getting previewed in the preview box.

jQuery(window).load(function(){

            jQuery('#cropbox').Jcrop({
                onChange: showPreview,
                onSelect: showPreview,
                setSelect: [ 100, 0, 100, 100 ],
                aspectRatio: 1
            });

        });

这只是我想要的方式。您的脚本可能还有其他错误。但你不必调用任何特殊的东西来显示预览。如果您没有执行此onload,请尝试执行onload。

This just worked the way i wanted. You might have some other error on your script. But you dont have to invoke anything special to have to show the preview. If you are not doing this onload then try doing it onload.

这篇关于jCrop - 更新预览onload?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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