получить вычисленный радиус границы в опере - PullRequest
2 голосов
/ 10 марта 2011

Я пытаюсь получить вычисленное состояние радиуса границы некоторого элемента с помощью этого кода:

function _elementCurrentStyle(element, styleName){
    if (element.currentStyle){
        var i = 0, temp = "", changeCase = false;
        for (i = 0; i < styleName.length; i++)
            if (styleName[i].toString() != '-'){
                temp += (changeCase ? styleName[i].toString().toUpperCase() : styleName[i].toString());
                changeCase = false;
            } else {
                changeCase = true;
            }
        styleName = temp;
        return element.currentStyle[styleName];
    } else {
        return getComputedStyle(element, null).getPropertyValue(styleName);
    }
}

    var borderRadiusCheck = ["-moz-border-radius-bottomright","border-radius","border-bottom-right-radius","-webkit-border-bottom-right-radius","-khtml-border-radius-bottomright","-khtml-border-bottom-right-radius"];
    var i = 0, temp = "";
    for (i = 0; i < borderRadiusCheck.length; i++){
        temp = _elementCurrentStyle(myElement, borderRadiusCheck[i]);
        if (temp)
            break;
    }

Переменная «myElement» - это HTML-элемент с границей радиуса, установленной в «20px».(Либо установив его динамически и с помощью CSS)

Переменная «temp» содержит строку borderRadius («20px»).Этот код работает в IE, FF и Chrome, но в Opera я получаю пустую строку при попытке получить «border-radius» или «border-bottom-right-radius», а при вызове с другими возвращает «undefined».

Не имеет значения, получаю ли я border-radius или border-bottom-right-radius, потому что все границы этого элемента HTML одинаковы.

Есть ли у вас какие-либо идеи, какой стильимя свойства, к которому я должен обратиться, чтобы получить радиус?

Спасибо за Вашу помощь.

1 Ответ

0 голосов
/ 26 октября 2011

Opera поддерживает border-radius . При использовании Opera Dragonfly вы можете заметить, что

border-radius: 10px;

преобразуется в

border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
...