jQuery colorbox plugin resize callback

好久不见. 提交于 2019-12-24 02:55:12

问题


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 shows visually, but when clicked to move, it jumps

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/

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.

Thanks!


回答1:


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

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

Good luck!



来源:https://stackoverflow.com/questions/6735208/jquery-colorbox-plugin-resize-callback

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!