jQuery colorbox插件调整回调 [英] jQuery colorbox plugin resize callback

问题描述

我有一个ASP.NET MVC应用程序，我使用两个JQuery插件：colorbox和jcrop。我的问题是使用colorbox resize功能。将内容加载到颜色框后，我调用resize函数调整颜色框的大小以更好地适应其内容。除了之后我立即将jcrop插件添加到混音中之外，这种方法效果很好。在颜色框调整大小功能完成之前，Jcrop稍微触发。因此，它会扭曲jcrop的数据。这会导致裁剪工具跳转到初始移动，如下例所示：

I have an ASP.NET MVC application and I am using two JQuery plugins: colorbox and jcrop. My issue is with the colorbox resize function. After I load the content into the colorbox I call the resize function to resize colorbox to fit its contents better. This works great except for the fact that immediately after that I add the jcrop plugin to the mix. Jcrop fires slightly before the colorbox resize function finishes. Because of this, it distorts the data for jcrop. This causes the crop tool to jump on the initial move, as in this example:

http://jsfiddle.net/Xg84D/12/

注意上面的例子中裁剪选择器是如何跳过的最初的举动，如同这个问题：

Notice how in the above example the crop selector jumps on the initial move, as in this question:

jQuery Jcrop setSelect可视化显示，但点击移动时，它会跳跃

唯一我发现停止这个的方法是将jcrop位包装在 setTimeout（）中并将代码延迟1秒以确保在代码触发之前完成调整大小，如下例所示：

The only way I have found to stop this, is to wrap the jcrop bit in a setTimeout() and delay the code for 1 second to ensure the resize is finished before the code fires, as in this example:

http：// jsfiddle .net / Xg84D / 13 /

现在当您拖动裁剪区域时，它首先不会跳转。使用 setTimeout（）肯定是我不喜欢的黑客，所以我想知道是否有人有任何建议。如果只有 jQuery.colorbox.resize（）在其设置对象上接受了回调函数。

Now when you drag the crop area it does not jump around at first. Using setTimeout() is definitely a hack that I don't like so I'd like to know if anyone has any suggestions. If only jQuery.colorbox.resize() accepted a callback function on its settings object.

谢谢！

推荐答案

在GitHub的colorbox开发版中，有一个提交可以解决你的问题。

看到它< a href =https://github.com/jasonmoo/colorbox/commit/91de326355a51cfcf49762a41f97479f6fc9b9a1#diff-0\"rel =nofollow>这里

In the development version of colorbox at GitHub, there's a commit that solves your problem.
See it here

我认为您应该在jquery.colorbox.js文件中编辑函数 resize 以接受回调参数。如链接所示。

I think that you should edit the function resize in jquery.colorbox.js file to accept a callback parameter. AS the link suggest.

@@ -450,7 +450,7 @@    
     });    
   };     

-  publicMethod.resize = function (options) {    
+  publicMethod.resize = function (options, loadedCallback) {    
     if (open) {    
       options = options || {};

@@ -475,7 +475,7 @@

       }

       $loaded.css({height: settings.h});           

-      publicMethod.position(settings.transition === "none" ? 0 : settings.speed);    
+      publicMethod.position(settings.transition === "none" ? 0 : settings.speed, loadedCallback);
     }
   };

祝你好运！

这篇关于jQuery colorbox插件调整回调的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！