jQuery colorbox插件调整大小回调

jQuery colorbox plugin resize callback

本文关键字：回调 调整 colorbox 插件 jQuery      更新时间：2023-09-26

我有一个ASP。. NET MVC应用程序，我使用两个JQuery插件:colorbox和jcrop。我的问题是colorbox调整大小功能。在将内容加载到colorbox之后，我调用了resize函数来调整colorbox的大小，使其更适合其内容。这工作得很好，除了在那之后我立即添加了jcrop插件。Jcrop在colorbox调整大小函数完成之前稍微触发。因此，它会扭曲jcrop的数据。这会导致裁剪工具在初始移动时跳转，如下例所示:

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

注意在上面的例子中裁剪选择器是如何在初始移动时跳转的，就像下面这个问题:

jQuery Jcrop setSelect显示在视觉上，但是当点击移动时，它会跳转

我发现阻止这种情况的唯一方法是将jcrop位包装在setTimeout()中并延迟代码1秒，以确保在代码触发之前完成大小调整，如以下示例: http://jsfiddle.net/Xg84D/13/

现在当你拖动裁剪区域时，它一开始不会跳跃。使用setTimeout()绝对是一个hack，我不喜欢，所以我想知道如果有人有任何建议。如果只有jQuery.colorbox.resize()在其设置对象上接受回调函数

谢谢!

在GitHub的colorbox开发版本中，有一个提交可以解决您的问题。
看这里

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

@@ -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);
     }
   };

祝你好运!

相关文章：