[Javascript] Made up CSS tags

[Terry Riegel]

Here is the answer I just found. Unless any of you know of a  
workaround...

http://stackoverflow.com/questions/249991/can-i-fetch-the-value-of-a-non-standard-css-property-via-javascript

It seems it is not possible. Something I hate to say.

Terry

On Nov 29, 2008, at 3:03 PM, Terry Riegel wrote:

> Hello All,
>
> I am working on adding rounded corner functionality to IE, and
> optionally to other browsers. I have the core code working in IE,
> Safari, Mozilla, Chrome, and Opera.
>
> Firefox and Safari already have their own CSS specifiers for rounded
> corners, namely
>
> -webkit-border-radius: 25px;
> -moz-border-radius: 25px;
>
> I would like my javascript solution read the css and apply borders
> based on the CSS. I would like to add a contrived CSS tag like
>
> -cc-border-radius: 25px;
>
> Then have the javascript determine if the browser is handling the
> borders or if it should handle them. For example is the author had
> this in his CSS...
>
> -webkit-border-radius: 25px;
> -cc-border-radius: 25px;
>
> Then it would let Safari draw its own borders, but would draw them for
> Firefox and IE.
>
>
>    function styleit()
>    {
>     if (isIE)
>     {
>      for(var t = 0; t < document.styleSheets.length; t++)
>      {
>       for(var i = 0; i < document.styleSheets[t].rules.length; i++)
>       {
>        var allR =
> document.styleSheets[t].rules[i].style.IEborderRadius    || 0;
>        var tR   =
> document.styleSheets[t].rules[i].style.IEborderRadiusTR  || allR;
>        var tL   =
> document.styleSheets[t].rules[i].style.IEborderRadiusTL  || allR;
>        var bR   =
> document.styleSheets[t].rules[i].style.IEborderRadiusBR  || allR;
>        var bL   =
> document.styleSheets[t].rules[i].style.IEborderRadiusBL  || allR;
>        if (allR || tR || tR || bR || bL)
>        {
>         var r=document.styleSheets[t].rules[i].style.IEborderRadius;
>         var s=document.styleSheets[t].rules[i].selectorText;
>         var settings = {tl: { radius: 45 }, tr: { radius: 45 }, bl:
> { radius: 45 }, br: { radius: 45 }, antiAlias: true   , autoPad:
> true     , validTags: ["div"]}
>         settings.tl.radius=replace(tL,'px','');
>         settings.tr.radius=replace(tR,'px','');
>         settings.bl.radius=replace(bL,'px','');
>         settings.br.radius=replace(bR,'px','');
>         var myBoxObject = new curvyCorners(settings,
> replace(s,'.','') );
>         myBoxObject.applyCornersToAll();
>        }
>       }
>      }
>     } else if(isMoz) .......
>
>
> Here is my code above. I have two issues I would like help resolving.
>
> 1. It seems IE will allow for the made up IEborderRadius, but will not
> allow made up ones with hyphens in them.
>
> 2. Safari and Firefox throw away the IEborder Radius once they
> determine it is made up, so it there a way I can "read" the CSS to
> determine if document.stylesheets.rules.style.IEborderRadius exists?
>
> I hope this post isn't overly confusing. Any help will be greatly
> appreciated
>
> Thanks,
>
> Terry Riegel
>
>
> _______________________________________________
> Javascript mailing list
> Javascript at lists.evolt.org
> http://lists.evolt.org/mailman/listinfo/javascript