lvhaiyan888 / curved-corner

Automatically exported from code.google.com/p/curved-corner
0 stars 0 forks source link

Curve document body + IE8 Fix #54

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
At the moment, it's not possible to apply border-radius to the document body 
(it hides the body completeley)

Firstly, my fix:

if (this.tagName == 'BODY') {
        el = el.parentElement;

        //this is silly but the only way to measure the body's x/y (body.offsetLeft is 0).
        var measure = window.document.createElement('div');
        if (this.firstChild) {
            this.insertBefore(measure, this.firstChild);
        }
        else this.appendChild(measure);

        var left_add = measure.offsetLeft;
        var top_add = measure.offsetTop;
    }
    else {
        var left_add = 0;
        var top_add = 0;
        while ((typeof(el) != 'unknown') && (el.currentStyle.position != 'relative') && (el.tagName != 'BODY')) {
            el = el.parentElement;
            i++;
            if (i >= limit) { return(false); }
        }
    }

...

this_pos.y = top_add + this_pos.y + (0.5 * strokeWeight) - el_pos.y;
    this_pos.x = left_add + this_pos.x + (0.5 * strokeWeight) - el_pos.x;

This is messy and can almost certainly be tidied up. 

Essentially it adds special behaviour for the body so it appears then 
calculates the body's true offsets and adds the body's offset to rect's 
position.

This works in IE8 but is broken in IE7. I am looking at getting it to work in 7 
and 6.

Original issue reported on code.google.com by thejkwhosaysni@gmail.com on 19 Aug 2010 at 1:15