Tag: jcrop

JCropped获取裁剪图像高度: 我正在使用JCrop来获取要裁剪的图像的尺寸。我有获取尺寸的代码，如下所示： function updateCoordinates(c) { console.log(c) $(‘#image_x’).val(cx); $(‘#image_x2’).val(c.x2); $(‘#image_y’).val(cy); $(‘#image_y2’).val(c.y2); $(‘#image_w’).val(cw); } $(‘#jcrop_target’).Jcrop({ aspectRatio : 2 / 1, onSelect : updateCoordinates, onChange : updateCoordinates }); 变量’c’具有值cx，c.x2，cy，c.y2和cw。我猜测cw = width，cx = x坐标和cy = y坐标，但我如何获得图像的高度？我很想把这些值传递给PHP Imagick裁剪。 getOriginalUrl()); $picture->cropImage($width, $height, $x, $y); 我觉得我错过了一些明显的东西。

流体图像上的Jquery JCropfunction: 所以我在我的图像上实现了JCrop，现在必须进行设计更改，才能使图像变得流畅。我的图像现在有max-height:100%;max-width:100%并且它在没有JCrop的情况下相应地缩放，但是对于JCrop它没有，这是因为JCrop在初始化时为图像设置了固定的witdth和height，例如： display: none; visibility: hidden; width:540px; height:430px; $(‘#feature’).children(‘img’).eq(0).removeAttr(‘style’); $(‘#feature’).children(‘img’).attr(‘style’,’display: none; visibility: hidden; width:100% !important;height:100% !important;’); 但无济于事，它只是打破了JCrop。我只需要使图像和Jcrop本身调整并保持窗口大小调整的比例。关于如何解决这个问题的任何想法？谢谢！编辑 JSFIDDLE – > http://jsfiddle.net/EHQKH/2/ 只需擦除javascript，你应该看到它在窗口/框架resize时resize，而Jcrop则没有

不裁剪所选区域: 裁剪部分现在出现：使用正确的宽度和高度显示图像的不同部分。要裁剪的区域裁剪区 inheritance人我的js代码 jQuery(document).ready(function () { jQuery(‘#imgCrop’).Jcrop({ onSelect: storeCoords, onChange: storeCoords }); }); function storeCoords(c) { jQuery(‘#X’).val(cx); jQuery(‘#Y’).val(cy); jQuery(‘#W’).val(cw); jQuery(‘#H’).val(ch); }; protected void btnCrop_Click(object sender, EventArgs e) { string ImageName = Session[“WorkingImage”].ToString(); int w = Convert.ToInt32(W.Value); int h = Convert.ToInt32(H.Value); int x = Convert.ToInt32(X.Value); int y = Convert.ToInt32(Y.Value); byte[] CropImage = Crop(path + ImageName, […]

如何在Ajax提交后关闭fancybox？: 我正在使用Jquery表单插件。弹出窗口显示图像上传表格。图像上传成功。我想在成功上传图片后关闭弹出窗口。下面的javascript是用弹出内容编写的。 $(this).ajaxSubmit({ success: function(dd) { parent.$.fancybox.close(); } }); 但它没有用。 Jquery库，包含在弹出内容和父页面中的fancybox库。另外，我想用“dd（ajax返回值）”内容重新加载fancybox。它将具有Jcropfunction。现在，一旦用于上传图像的ajaxSubmit，Jcrop就无法正常工作。否则它正在工作编辑我重命名了page1 page2和page3以更好地理解index.html $(document).ready(function() { $(“.various”).fancybox({ maxWidth : 800, maxHeight : 600, fitToView : false, width : ‘70%’, height : ‘100%’, autoSize : false, closeClick : false, openEffect : ‘none’, closeEffect : ‘none’ }); }); Upload https://stackoverflow.com/questions/9313918/how-to-close-fancybox-after-ajax-submit/upload.php的 Upload […]

image onload事件在其图像完全加载之前触发？: 我正在使用Jcrop jquery插件，并在onload事件上触发initJcropBox()函数。但是在图像完全加载之前会触发此function。这引起了问题。例如显示jcropbox的大小不正确或根本没有显示jcropbox。当我放置一条线时，它工作正常。但不是解决方案。 setTimeout(‘initJcropBox()’,2000); 在浏览器中完全加载/渲染图像后，如何触发initJcropbox()函数？ var api; function initJcropBox(){ api = $.Jcrop(‘#cropbox’,{ bgColor: ‘black’, bgOpacity: .7, onSelect: updateCoords, onChange: updateCoords, boxWidth: 400 }); api.animateTo([0,0,$(‘#cropbox’).width(),$(‘#cropbox’).height()]); } function insertImage(name) { var img = new Image(); img.onload = initJcropBox; img.src = name; img.id = ‘cropbox’; return img; } $(‘td.imageFile’).live(‘click’, function(e){ fileWithPath = “uploads/original/” + […]

输入文件在JCrop中显示实时选择的图像: 我正在使用JCrop来调整图像大小和裁剪图像。我想添加一个function，以便用户可以： – 选择图像文件 – 使用jcrop进行编辑 -Upload而不更改页面我可以单独完成所有这些，但是当我混合这些时，我会收到错误。 $(‘#target’).attr(‘src’, e.target.result); $(‘#target2’).attr(‘src’, e.target.result); 现在的问题是，当我更改id“target”主图像的src位置时，它不会显示我的新图像。但是，当我在id“target2”预览图像上执行此操作时，它会显示我的新图像并且我可以对其进行处理。（但是当我按下裁剪时不会裁剪新图像） function dudecmon(){ jQuery(function($){ // Create variables (in this scope) to hold the API and image size var jcrop_api, boundx, boundy, // Grab some information about the preview pane $preview = $(‘#preview-pane’), $pcnt = $(‘#preview-pane .preview-container’), $pimg = $(‘#preview-pane .preview-container img’), xsize […]

JCrop调整图像大小而不是裁剪 – Javascript: 我正在尝试使用JCrop裁剪图像。然而，结果是令人沮丧的错误，我不知道为什么。我有一个图像上传器，当有人在图像中选择时，javascript会更改页面上已有图像的来源以匹配新上传的图像。然后我有这个代码： $(‘#myForm’).ajaxForm({ dataType: ‘json’, success: function (result) { $(“#image-editor-preview img”) .attr(“src”, “/Profiles/AvatarWorker/” + _id + “?random=” + Math.random()) .Jcrop({ aspectRatio: 1, setSelect: [100, 100, 50, 50], minSize: [160, 160], maxSize: [160, 160], onChange: setCoords, onSelect: setCoords }); } }); var x = 0, y = 0, w = 0, h = 0; […]

裁剪图像绘制到canvas与JCrop: 我是HTML5的新手，并尝试使用JCrop裁剪图像。如果我想直接裁剪它没有问题但是当它被绘制到canvas时JCrop不起作用。我想原因可能是我正在创建一个图像变量，以便能够将其绘制到视口canvas并动态设置它的Id。因此Jquery无法访问动态创建的图像。但即便如此，我也不知道该怎么做。这是我的完整HTML代码。 acanimal – Crop image on the client side with JCrop and HTML5 canvas element $(window).load(function () { var canvas = document.getElementById(‘viewport’), context = canvas.getContext(‘2d’); make_base(); function make_base() { var base_image = new Image(); base_image.id = ‘target’; base_image.src = ‘demo_files/sago.jpg’; base_image.onload = function () { context.drawImage(base_image, 0, 0); } } […]

jQuery如何添加到Jcrop缩放function: JCrop它是一个非常好的插件，但遗憾的是缺少Zoom-In Zoom-Outfunction。我想知道是否有人试图在jCrop中添加放大缩小function。请发布代码示例。谢谢

无法在Jcrop中拖动选择，有什么可以打破它？: 我很茫然。我正在使用JQuery 1.4.2和JCrop 0.98。其他一切工作正常，但一旦创建我就无法移动选择。当我将鼠标hover在选择上并单击时，没有任何反应。我有JQuery库，JCrop库和JCrop css文件都包含在内。这是一个非常干净的页面，没有其他很多东西。我不知道我是不是在我自己的javascript和css中意外地覆盖了某些东西，它打破了JCrop，两者都有相当多。但Firebugs并没有改变任何事情。虽然他们使用不同版本的jquery，但我的浏览和服务器上的教程工作正常。但是，当我将它们最初使用的版本替换为我使用的版本时，它们继续正常工作。所以它必须与我的javascript或css有关。我在这里完全失去了，我正在考虑我可以想到的问题，但我甚至不知道在哪里看。有没有其他人遇到过这个问题？问题是什么，你是如何解决的？我应该在哪里寻找错误或错误覆盖？