I am new to javascript and barley know html or css but I wanted to know if there is a script that when a submit button is pressed a preloaded link will show at random and each letter in the link will be a preloaded random color?

no idea if one exists or not but something like that should be codeable.

yeah Im probably going to have to just code it. I was hoping to get lucky lol does anyone think its possible to code though? Like I said I am just getting into javascript. Im sure its possible..... but maybe not with javascript?

It's definitely doable with javascript, colouring each letter differently could get a bit complicated though But nothing that can't actually be done.

I definitely don't recommend trying to learn javascript without having a solid grasp of HTML and CSS first. You need to know this stuff to have any idea of what is going on with the DOM in js.

Does anyone think I could pay someone to build me a script like that? I wont be able to figure it out.

Here you go:

<script type="text/javascript">
var links=['http://www.google.com','http://www.lucasgreen.com'];
// change or add as many links as you want in this array
var colors=['ff0000','00ff00','0000ff','ffff00','ff00ff','00ffff','999999'];
// which possible colors you want go in this array
function showLink(){
// this function shows a random link with each letter a random color
  var whichLink=Math.floor(Math.random()*links.length);
  var whichColor;
  var s='<a href="'+links[whichLink]+'">';
  for (var i=0;i<links[whichLink].length;i++){
    whichColor=Math.floor(Math.random()*colors.length);
    s+='<span style="color:#'+colors[whichColor]+';">';
    s+=link[whichLink].charAt(i);
    s+='</span>';
  }
  s+='</a>';
  document.getElementById('linkholder').innerHTML=s;
}
</script>
<input type="button" value="Click Me" onclick="showLink();" />
<div id="linkholder"></div>

Should work, if it doesn't then play with it to fix the bugs. Wrote it off the top of my head and haven't tested it in any way, but that's the gist of it.

thought I'd start you off with this;

var colours = new Array("000000","666633","FF0000","CC0099","3300FF","CCFF00","00FF33","FF9900","CC99FF","0000FF","FF33FF","333399","FF99CC","66FFFF","3366FF","CCCC99","009999")

function rndColour () {
n = colours.length + 1
  return "#" + colours[( Math.floor ( Math.random ( ) * n - 1 ) )];
}

function setColour() {
var textEle = document.getElementById("text").innerHTML;
var letters = textEle.split("")
	for (var i=0;i<letters.length;i++) {
		letters[i] = '<span style="color:' + rndColour() + ';">' + letters[i] + '</span>';
	}
	document.getElementById("changecolour").innerHTML = letters.join("");
}

<h2 id="text" class="italic">Javascript Colour (color) Change</h2>
<h2 id="changecolour" class="italic"></h2>


<input type="button" name="colbtn" value="Change Colour" onclick="setColour();" >

A simple example (no DOM coding required) and can be seen working at;
http://www.candsdesign.co.uk/article...oured-letters/

thanks both of you i wont get to try out nyef's script untill i get home im a work lol

Thought I'd tidy mine up and expand it a little to include links with real anchor text, simply because it will make a good write up for my occasional articles
And it shows how to make a multi-dimensioned array in js

javascript code:

var colours = new Array("000000","666633","FF0000","CC0099","3300FF","CCFF00","00FF33","FF9900","CC99FF","0000FF","FF33FF","333399","FF99CC","66FFFF","3366FF","CCCC99","009999");

// create an array of arrays to simulate a multi-dimensional array
var links = new Array(9);
for (var i=0;i < links.length; i++) {
	links[i] = new Array(2);
}
// populate arrays 
links[0][0] = "www.google.com";
links[1][0] = "www.candsdesign.co.uk";
links[2][0] = "www.w3schools.com";
links[3][0] = "www.webmaster-talk.com";
links[4][0] = "www.devguru.com";
links[5][0] = "www.welovecss.com";
links[6][0] = "www.asp101.com";
links[7][0] = "www.csszengarden.com";
links[8][0] = "www.cssplay.co.uk";

links[0][1] = "Google";
links[1][1] = "C and S Design";
links[2][1] = "W3Schools";
links[3][1] = "Webmaster Talk";
links[4][1] = "DevGuru";
links[5][1] = "We Love CSS";
links[6][1] = "ASP 101";
links[7][1] = "CSS ZenGarden";
links[8][1] = "CSS Play";


function getRandomColour () {
n = colours.length;
  return "#" + colours[( Math.floor ( Math.random ( ) * n) )];
}

function getRandomLink () {
n = links.length;
  return ( Math.floor ( Math.random ( ) * n ));
}

function setColour() {
var textEle = document.getElementById("text").innerHTML;
var letters = textEle.split("")
	for (var i=0;i<letters.length;i++) {
		letters[i] = '<span style="color:' + getRandomColour() + ';">' + letters[i] + '</span>';
	}
	document.getElementById("changecolour").innerHTML = letters.join("");
}

function setTextColour(text) {
var letters = text.split("")
	for (var i=0;i<letters.length;i++) {
		letters[i] = '<span style="color:' + getRandomColour() + ';">' + letters[i] + '</span>';
	}
	return letters.join("");
}

function showLink() {
var id = getRandomLink();
var href = 'http://' + links[id][0];
var anchorText = setTextColour(links[id][1]);

var anchorEle = '<a href="' + href + '">' + anchorText + '</a>';

	document.getElementById("colouredlink").innerHTML = anchorEle;

}

<h2 id="text" class="italic">Show Coloured Link</h2>
<h2 id="colouredlink" ></h2>
<input type="button" name="lkbtn" value="Show Link" onclick="showLink();" >

http://www.candsdesign.co.uk/article...oured-letters/

wow thanks your probably the best mod ive seen! lol im going to try to tweak it so it fits me better I want pop up windows of the random links i think i can figure that out. One question though when i hit the button and the links show up can it look like its in a text box?

Thought I'd add the object oriented version, I even kept the crazy spelling of colour

var Link = function(text,url){
    this.text = text;
    this.url = url;
}

var RandomColouredLinks = {
    colours : new Array("000000","666633","FF0000","CC0099","3300FF",
            "CCFF00","00FF33","FF9900","CC99FF","0000FF","FF33FF",
            "333399","FF99CC","66FFFF","3366FF","CCCC99","009999"),
    links : new Array(
    ),
    init : function (links){
        this.links = links;
    },
    getRandomColour : function(){
        var n = this.colours.length;
        return "#" + this.colours[( Math.floor ( Math.random ( ) * n) )];
    },
    getRandomLink : function () {
        var n = this.links.length;
        return this.links[( Math.floor ( Math.random ( ) * n ))];
    },
    showLink : function(nodeId) {
        var element = document.getElementById(nodeId);
        var link = this.getRandomLink();
        var anchor = document.createElement("a");
        anchor.setAttribute("href", "http://"+link.url);
        for(var i = 0; i < link.text.length; i++){
            anchor.appendChild(this.colourLetter(link.text.charAt(i)));
        }
        if(element.childNodes[0]){
            element.replaceChild(anchor,element.childNodes[0]);
        }else{
            element.appendChild(anchor);
        }
    },
    colourLetter : function (letter){
        var span = document.createElement("span");
        span.appendChild(document.createTextNode(letter));
        span.setAttribute("style","color:"+this.getRandomColour());
        return span;
    }
};
RandomColouredLinks.init( new Array(
    new Link("Google" , "www.google.com"),
    new Link("C and S Design" , "www.candsdesign.co.uk"),
    new Link("W3Schools" , "www.w3schools.com"),
    new Link("Webmaster Talk" , "www.webmaster-talk.com"),
    new Link("DevGuru" , "www.devguru.com"),
    new Link("We Love CSS" , "www.welovecss.com"),
    new Link("ASP 101" , "www.asp101.com"),
    new Link("CSS ZenGarden" , "www.csszengarden.com"),
    new Link("CSS Play","www.cssplay.co.uk")
));

activated with

<input type="button" name="lkbtn" value="Show Link" onclick="RandomColouredLinks.showLink('colouredlink');" >

yeah im glad they helped me out but i couldnt get willcode4beer to work right

Originally Posted by jayjay050

yeah im glad they helped me out but i couldnt get willcode4beer to work right

I forgot to test in IE.

Just change the function so that it reads

    colourLetter : function (letter){
        var span = document.createElement("span");
        span.appendChild(document.createTextNode(letter));
        span.style.cssText = "color:"+this.getRandomColour();
        span.setAttribute("style","color:"+this.getRandomColour());
        return span;
    }

I put a demo up on my site:
http://willcode4beer.com/tips.jsp?set=colorLinks

Let me know if it's working for you