Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Jul 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Javascript + External CSS

    Hwo can I get Javascript to pick a random external CSS link from a list and have that style sheet appear on my site?

    Code:
    <script language="Javascript">
    
    var currentdate = 0
    var core = 0
    
    function StringArray (n) {
      this.length = n;
      for (var i =1; i <= n; i++) {
        this[i] = ' '
    
      }
    }
    
    image = new StringArray(7)
    image[0] = '<LINK href="http://uploadhut.com/view.php/202245.css" rel="stylesheet" type="text/css">'
    image[1] = '<LINK href="http://uploadhut.com/view.php/202248.css" rel="stylesheet" type="text/css">'
    image[2] = '<LINK href="http://uploadhut.com/view.php/202250.css" rel="stylesheet" type="text/css">'
    image[3] = '<LINK href="http://uploadhut.com/view.php/202254.css" rel="stylesheet" type="text/css">'
    image[4] = '<LINK href="http://uploadhut.com/view.php/202257.css" rel="stylesheet" type="text/css">'
    image[5] = '<LINK href="http://uploadhut.com/view.php/202261.css" rel="stylesheet" type="text/css">'
    image[6] = '<LINK href="http://uploadhut.com/view.php/202265.css" rel="stylesheet" type="text/css">'
    
    var ran = 60/image.length
    
    function ranimage() {
      currentdate = new Date()
      core = currentdate.getSeconds()
      core = Math.floor(core/ran)
        return(image[core])
    }
    
    document.write("' +ranimage()+ '")
    
    </script>
    I used this, but a freind found this as a random image picker so I tried messing around with it. My guess is that there is some sort of problem in the 'document.write' portion.

    Please note that this is part of a xanga skin I am using, so don't try using it on a site, but I assure you that each external CSS works perfectly on xanga. I suspected that xanga might block external CSS so I input each part of the array as the full code (instead of the link) but that didn't work either.

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,505
    Thanks
    3
    Thanked 501 Times in 488 Posts
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    
    <head>
      <title></title>
    
    <script language="JavaScript" type="text/javascript">
    <!--
    var StyleAry=new Array('c1.css','c2.css','c3.css');
    
    function LoadStyle(){
     n=parseInt((Math.random()*10)%StyleAry.length);
     s=document.createElement('LINK');
     s.rel='stylesheet';
     s.href=StyleAry[n];
     document.getElementsByTagName('HEAD')[0].appendChild(s);
    }
    
    //-->
    </script>
    
    </head>
    
    <body onload="LoadStyle();" >
    <span class=Class >TEXT</span>
    
    
    </body>
    
    </html>
    c1.css
    Code:
    .Class {
      font-Size:20px;
      color:green;
    }
    c2.css
    Code:
    .Class {
      font-Size:15px;
      color:blue;
    }
    c3.css
    Code:
    .Class {
      font-Size:10px;
      color:red;
    }

  • #3
    New to the CF scene
    Join Date
    Jul 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm not sure that's what I meant. Where do I enter the links to the externally hosted css code? I wanted to take sets of externally hosted css and have javascript choose from those to apply as my layout.

  • #4
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,505
    Thanks
    3
    Thanked 501 Times in 488 Posts
    if the user is to chose pass the .css to the function

    Code:
    <head>
      <title></title>
    
    <script language="JavaScript" type="text/javascript">
    <!--
    var StyleAry=new Array('c1.css','c2.css','c3.css');
    var s;
    function LoadStyle(n){
     if (s){
      document.getElementsByTagName('HEAD')[0].removeChild(s);
     }
     s=document.createElement('LINK');
     s.rel='stylesheet';
     s.href=StyleAry[n];
     document.getElementsByTagName('HEAD')[0].appendChild(s);
    }
    
    //-->
    </script>
    
    </head>
    
    <body onload="LoadStyle(0);" >
    <span class=Class onclick="LoadStyle(0);" >TEXT</span>
    <br>
    <span class=Class onclick="LoadStyle(1);" >TEXT</span>
    <br>
    <span class=Class onclick="LoadStyle(2);" >TEXT</span>
    <br>
    
    </body>
    
    </html>
    </html>

  • #5
    New to the CF scene
    Join Date
    Jul 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Nope. Random. I want the user to see a random layout that the code chooses from one of seven external css hosted layouts.

  • #6
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,505
    Thanks
    3
    Thanked 501 Times in 488 Posts
    I have posted random selection and user selection -

    All I can suggest now is to Get a Book

  • #7
    New to the CF scene
    Join Date
    Jul 2005
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hmm...I might do that, but thanks for the code.

    But answer a few questions: why do I need the class code (in your first suggestion) ? Which text is being stated as "20 px" or "15 px" if no links or text are going to be available to the user other then the layout thats provided within the code?
    Last edited by knexfreak; 07-10-2005 at 11:24 PM.

  • #8
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,505
    Thanks
    3
    Thanked 501 Times in 488 Posts
    These are 3 examples of .css filesto demeonstrate that a different .css file sheet is being loaded.

    any .css file can be loaded


  •  

    Posting Permissions

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