Box builds down then slides up into place

classic Classic list List threaded Threaded
3 messages Options
Reply | Threaded
Open this post in threaded view
|

Box builds down then slides up into place

fishnyc22
I love this script. Congrats on a great job.

I am using it with the jquery adapter. I found that my boxes build on screen different than the example. The box seems to build itself downwards then after it reaches its final size, it moves up and centers itself.

Any idea what would cause that? I much prefer the look of the examples where it grows form the center using the "sync" setting. I have animSequence set to sync but it still builds downwards...

Any help is appreciated.


Reply | Threaded
Open this post in threaded view
|

Re: Box builds down then slides up into place

RabM

I was getting this too - glad it wasn't just me doing something wrong.

It only happens when using jQuery (I'm using version 1.2.3) and only when animSequence is 'sync'.

I didn't find an elegant solution to this, but if you don't mind modifying shadowbox.js here's how I got it working -

Find the resizeContent function and change

    default: // sync
        adjustWidth(dims.width, true);
        adjustHeight(dims.height, dims.top, true, cb);

to

    default: // sync
        adjustSize(dims.width, dims.height, dims.top, true, cb);

and add the following function -

var adjustSize = function(width, height, top, animate, callback){
        height = parseInt(height);
        width = parseInt(width);
        
        current_height = height;
        current_width = width;

        // adjust the height
        var sbi = SL.get('shadowbox_body_inner');
        if(animate && options.animate){
            SL.animate(sbi, {
                height: { to: height }
            }, options.resizeDuration, callback);
        }else{
            SL.setStyle(sbi, 'height', height + 'px');
            if(typeof callback == 'function') callback();
        }

        // manually adjust the top because we're using fixed positioning in IE6
        if(absolute_pos){
            // listen for scroll so we can adjust
            centerVertically();
            SL.addEvent(window, 'scroll', centerVertically);

            // add scroll to top
            top += document.documentElement.scrollTop;
        }

        // adjust the top
        var shadowbox = SL.get('shadowbox');
        if(animate && options.animate){
            SL.animate(shadowbox, {
                top: { to: top },
                width: { to: width }
            }, options.resizeDuration);
        }else{
            SL.setStyle(shadowbox, 'top', top + 'px');
            SL.setStyle(shadowbox, 'width', width + 'px');            
        }
    };

It's pretty ugly, I just merged the adjustWidth and adjustHeight functions but it works.

Hopefully Michael (thanks for this awesome component btw!) or a jQuery expert might find a more elegant solution for this.

Rab.
Reply | Threaded
Open this post in threaded view
|

Re: Box builds down then slides up into place

fishnyc22
Hey, Thanks for the reply. Sorry for the late response. I was away on vacation.

Its weird because if I set it to 'wh' instead of sync it works as it should, but if I do 'sync' it doesnt work.

I'll give your code a try. I hate editing code that will get updated for the obvious tracking reasons, but for now its a good solution. thx buddy.

Fish
><>