Colorbox以错误的大小打开,然后缩小到正确的大小

时间:2012-01-15 15:18:16

标签: jquery colorbox

我有一个网页,其中包含多个打开Colorboxes的链接。除一个链接外,所有链接都正常工作。问题链接在大多数方面都可以正常工作,但是当颜色框打开时,它会比参数中指定的更大,然后缩小到正确的大小。

我在网上发现了类似的问题(无法回想起它是否在Stackoverflow上),这是通过确保在脚本之前加载的colorbox css文件来解决的。我这样做了,但没有任何区别。

在页面上的各种颜色框中,这是唯一包含表单或任何ajax内容的颜色框。这可能不相关,但这是我在这个颜色盒和其他可以正常工作的颜色盒之间看到的唯一真正的区别。

链接的代码是:<a href="notifyList.cgi?bibId={$bibId}" rel="notifyMe" id="notifyFormLink">Notify Me</a>

jQuery代码粘贴在下面。任何帮助将不胜感激。

                    $(function(){
                        $('#notifyFormLink').colorbox({
                                width:300,
                                height:270,
                                opacity:0,
                                transition:"none",
                                scrolling:false,
                                onComplete: function() {
                                    notifySubmit();
                                }}); // end colorbox
                    }); // end anon function                        

                    function notifySubmit() {
                        // $.colorbox.resize();
                        $('#emailNotify').focus();
                        $("#notifyForm").submit(function(){
                            var input = $('#emailNotify').val();
                            if (input.match(/^[\w\d\.\+]+@[\w\d\.\+]+$/)) {
                                $.get(
                                    $(this).attr('action'),
                                    $(this).serialize(),
                                    function(data){
                                        $().colorbox({
                                            html: data,
                                            width:300,
                                            height:270,
                                            opacity:0,
                                            transition:"none",
                                            scrolling:false,
                                            onComplete: function() {
                                                notifySubmit();
                                                }});
                                            } // end data
                                        ); // end get
                                        return false;
                            } else {
                                $('#validationResponse').html('<span style="font-size:12px">Bad e-mail: please try again.</span>');
                                return false;       
                            }
                         }); // end submit 
                    } // end notifySubmit

1 个答案:

答案 0 :(得分:0)

显然,答案是在此用例中将initialHieght和initialWidth属性与innerHeight和innerWidth结合使用。