A Flash Developer Resource Site

Results 1 to 7 of 7

Thread: CSS and AS2 just not working

  1. #1
    Member
    Join Date
    May 2007
    Posts
    55

    CSS and AS2 just not working

    I've stared at this for 24 hours and tried innumerable changes and nothing seems to work - can anyone see what I've missed?

    I'm loading text from external text file (works fine), but for some reason the CSS is not being applied...

    The text fields (all called txt1) are embedded inside movieclips numbered from tc0 to tc9. I've tried setting then to html and not.

    All text fields apppear correctly in the MC but the first (_root.tc0.txt1) is unstyled. I'm just using the first one to get the system up and running before applying the style to all fields.

    Here's the code:

    Code:
    stop();
    #include "as/tween.as"
    var i:Number;
    var k:Number;
    var flag:Boolean = false;
    var q:MovieClip;
    var myLV:LoadVars = new LoadVars();
    
    // ------------ start LoadVars ---------------- \\
    
    myLV.onLoad = function(success) {
     if (success) {
      for (i = 0; i<10; i++) {
       _root['tc'+i].txt1.html = true;
       _root['tc'+i].txt1.htmlText = myLV['part'+i];//this populates the variables
       _root['tc'+i]._alpha = 0;
       _root['tc'+i]._visible = false;
       k = (i+1);
       setBtn(_root['tc'+i],k);
       _root.inv1.onRelease = function() {
        _root['tc0']._visible = true;
        if (flag) {
         _root.gotoAndStop(10);
        } else {
         fader(_root['tc0'],0,100,2);
         flag = !flag;
        }
       };
      }
     } else {
      _root.tc0.txt1.text = 'Ooops there is something wrong - better check it out.';
     }
    };
    
    // ------------ start cssStyle ---------------- \\
    
    var cssStyle:TextField.StyleSheet = new TextField.StyleSheet();
    
    cssStyle.onLoad = function(success) {
     if (success) {
      _root.tc0.txt1.StyleSheet = cssStyle;
      myLV.load('vars/template.txt');
     } else {
      _root.tc0.txt1.htmlText = 'ERROR';
     }
    };
    cssStyle.load('css/style.css');
    // ---------------- end cssStyle ---------------- \\
    
    function setBtn(mc, k) {
     mc.onRelease = function() {
      _root['tc'+k]._visible = true;
      if (_root['tc'+k]._alpha<99) {
       fader(_root['tc'+k],0,100,2);
      }
     };
    }
    and the CSS which is in an external style.css file is:

    Code:
    p {
     color:   #ffff99;
     font-family:  Verdana, Arial, Helvetica, sans-serif; 
     font-size:   20px;
    }
    All the traces I put in suggest that it's all ok.

    Anyone see where I'm going wrong?

  2. #2
    :
    Join Date
    Dec 2002
    Posts
    3,518
    Code:
    // if your variable data isn't wrapped in a 'p' tag....otherwise ignore this
    _root['tc'+i].txt1.htmlText = "<p>"+myLV['part'+i]+"</p>" ;//this populates the variables
    Code:
    // lowercase 's' on 'styleSheet' here...
    _root.tc0.txt1.styleSheet = cssStyle;

  3. #3
    Member
    Join Date
    May 2007
    Posts
    55

    AS2 CSS not loading still

    Quote Originally Posted by dawsonk View Post
    Code:
    // if your variable data isn't wrapped in a 'p' tag....otherwise ignore this
    _root['tc'+i].txt1.htmlText = "<p>"+myLV['part'+i]+"</p>" ;//this populates the variables
    Code:
    // lowercase 's' on 'styleSheet' here...
    _root.tc0.txt1.styleSheet = cssStyle;
    The data is all wrapped up in <p> tags:
    Code:
    &part=<p>something</p>
    &part0=<p>This is the actual question</p>
    &part1=<p>Roll your mouse over the apparatus components of the general set-up for more details. Please turn the cell off before loading a new cell.</p>
    &part2=<p>The high resistance voltmeter measures the potential difference (in volts) between the iron half cell and the silver half cell.</p>
    &part3=<p>The salt bridge contains a solution of potassium nitrate allowing movement of ions between the two solutions to prevent any build up of charge.</p>
    &part4=<p>The iron metal rod establishes an equilibrium between iron atoms and the iron 2%2B ions in solution.</p>
    &part5=<p>The silver metal rod establishes an equilibrium between silver atoms and the silver %2B ions in solution.</p>
    &part6=<p>The iron ions in solution interact with the iron atoms in the electrode. <br>Fe2%2B(aq) %2B 2e --> Fe(s) </p>
    &part7=<p>The silver ions in solution interact with the silver atoms in the electrode. <br>Ag%2B(aq) %2B 1e --> Ag(s) </p>
    &part8=<p>No potential difference (voltage) is recorded until the switch completes the circuit.</p>
    &part9=<p>The iron half cell is providing electrons and the silver half cell is attracting electrons.</p>
    I tried changing the upper case 'S' to lower case and still no go..

    My styleSheet loader looks like:

    Code:
    // ------------ start cssStyle ---------------- \\
    
    var cssStyle:TextField.StyleSheet = new TextField.StyleSheet();
    cssStyle.onLoad = function(success:Boolean):Void {
        if (success) {
            _root.tc0.dyn_txt.styleSheet = cssStyle;
    	myLV.load('vars/template.txt'); // this is loading the variables OK
        } else {
            trace("Error loading CSS file.");
        }
    };
    cssStyle.load("css/style.css");
    // ---------------- end cssStyle ---------------- \\
    as you can see I'm trying to target a dtext field inside a MC instance name tc0

    Code:
    _root.tc0.dyn_txt.styleSheet = cssStyle;
    The dtext field has the instance name 'dyn_txt' and the variable name 'txt1'

    I have tried addressing the text variable and the instance name of the field but without success.

    Neither does this work:

    Code:
    _root.tc0.dyn_txt.txt1.styleSheet = cssStyle;
    When I trace the success of the load I get positive results. I just can't see my way round this one...

  4. #4
    :
    Join Date
    Dec 2002
    Posts
    3,518
    Use the instance name of the textfield, remove the variable.

    To test it. Created a new file. Add the following code to the first frame. In the first frame create a MC (instance name tc0) inside it place a text field instance name txt1.
    Make sure field is large enough to hold the text. Make copies of the MC and change instance names (tc1, tc2, etc.)

    Use the style.css and template.txt files posted above.
    Code:
    stop();
    var i:Number;
    var myLV:LoadVars = new LoadVars();
    // ------------ start LoadVars ---------------- \\
    myLV.onLoad = function(success) {
    	if (success) {
    		for (i=0; i<10; i++) {
    			_root['tc'+i].txt1.html = true;
    			_root['tc'+i].txt1.htmlText = myLV['part'+i];//this populates the variables
    		}
    	} else {
    		trace("Ooops there is something wrong - better check it out.");
    	}
    };
    // ------------ start cssStyle ---------------- \\
    var cssStyle:TextField.StyleSheet = new TextField.StyleSheet();
    cssStyle.onLoad = function(success) {
    	if (success) {
    		for (i=0; i<10; i++) {
    			_root['tc'+i].txt1.styleSheet = cssStyle;
    		}
    		myLV.load('vars/template.txt');
    	} else {
    		trace("Error loading CSS file.");
    	}
    };
    cssStyle.load('css/style.css');
    // ---------------- end cssStyle ---------------- \\

  5. #5
    Member
    Join Date
    May 2007
    Posts
    55

    As2 & css

    I did exactly as you suggested and got a blank screen...

    I copy / pasted to make sure there were no errors. I've uploaded the .fla file so you can see...

    Neither of the load-fail traces appear.

    Attached Files Attached Files

  6. #6
    :
    Join Date
    Dec 2002
    Posts
    3,518
    In your file, go to the txt1 text field, in the properties tab, under character change the family to _sans.

  7. #7
    Member
    Join Date
    May 2007
    Posts
    55
    Quote Originally Posted by dawsonk View Post
    In your file, go to the txt1 text field, in the properties tab, under character change the family to _sans.
    Hala! It works.. but why?

    What's wrong with Verdana?

    BTW, Thanks for your time and effort.

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center