Tag Archives: css

HTML5 and CSS3 Resources

It is an age of information overload, it is very hard to keep myself focused while searching and learning about anything. I am often lost in jungle of thousands of links/pages talking about same thing.

Following is a list, which I refer when I am reading about HTML5/CSS3:

Extending CSS capablities in Macromedia Flash Player

I am going to give a simple example using TextField.StyleSheet.transform(..). This is used to extend the CSS parsing capability. For example, “leading” is not parsed by CSS parser in Flash Player. Let’s make an example for the same.

First we would extend TextField.StyleSheet by creating a subclass(StyleSheetEx) and overriding it’s transform method.

  • StyleSheetEx.as

    import TextField.StyleSheet;
    
    class StyleSheetEx extends TextField.StyleSheet {
      
      // override the transform method
      function transform(style:Object):TextFormat {
    	var _fmt:TextFormat = super.transform(style);
    	for (var z in style) {
          if (z == "leading") {
            _fmt.leading = style[z];
    		delete style[z];
            break;
          }
        }
    	for(var i in _fmt) {
    		trace(i + " : " + _fmt[i]);
    	}
       	return _fmt;
      }
    }
    // end class definition

  • style.css

    p {
    
    	leading:10;
    	font-style:italic;
    	font-family:arial;
    	text-decoration:none;
    }

  • StyleSheetEx.fla

    import StyleSheetEx;
    
    this.createTextField("_txt",this.getNextHighestDepth(), 50,50, 400,200);
    _txt.multiline = true;
    _txt.html = true;
    _txt.wordWrap = true;
    _txt.text = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc erat est, dapibus id, porttitor a, nonummy nec, augue. Vivamus non felis. Quisque posuere, est et iaculis convallis, felis eros tempor lectus, vel tempor dolor diam quis nisl. Donec tincidunt pellentesque leo. Donec eget nisl. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Morbi sit amet arcu ac magna elementum tristique. Nam fermentum.";
    
    var _css:TextField.StyleSheet = new StyleSheetEx();
    
    _css["owner"] = this;
    _css.onLoad = function(bSuccess) {
    
    this.owner._txt.styleSheet = this;
    
    }
    
    _css.load("style.css");
    

You can also see demo this example.

Create above files with code and test it. I hope, “leading” works for you also. I know there could be many better ways, as I can see many enhancements in the above code. Please feel free to suggest.