Quick JS request.

[cosmic duck]

My JS skills fall far below average, well actually they are practically nonexistent.

Anyway, i need a script to add a line of predefined HTML to my page when i click an <a href>
Would be great if i could get another one that just deletes the last added one.

This is what i need it to put in, each time the link is clicked:

<div class="tape" style="background-color: #b61fab"><a href="#">user</a></div>

It would be [i]very[/i] nice if you can make the hex colour value randomise for each div created (from a list of 10 or so would be fine) but it's not necessary.

Thanks guys.

[B]Update[/B] - Cheers guys, all done!

[ProWaffle]

What? Something that Cosmic Duck doesn't know?

This can't be the real Cosmic Duck...

SPY SAPPING MY FACEPUNCH

[turb_]

document.getElementById('theIDofTheDivYouWantToAddShiteTo').innerHTML += "your html code here";

I'm a little rusty on my randoms so I'll leave that as an excercise for the reader

[cosmic duck]

[QUOTE=turb_;20914405]

document.getElementById('theIDofTheDivYouWantToAddShiteTo').innerHTML += "your html code here";

I'm a little rusty on my randoms so I'll leave that as an excercise for the reader[/QUOTE]

What's the links to make them add and delete?

[turb_]

<a href='#' onclick="javascriptGoesHereOrAlternativelyYouCouldCallAFunction();">

[cosmic duck]

Thanks man.

Anyone got a moment for the random (or chosen randomly from a list of ~10) colours?

[editline]12:55PM[/editline]

Is this right?

<a href='#' onclick="document.getElementById('random').innerHTML += "<div class=\"tape\" style=\"background-color: #b61fab\"><a href=\"#\">user</a></div>";();">ADD</a>

[andersonmat]

If you wanted random ones, you can have an array with predefined hex colors:

var possibleColors = {"#666", "#777"};

Then you can have JavaScript add in the color:

// random color:
possibleColors[ Math.floor( Math.random() * possibleColors.length ) ];

Then you just have to concatenate the string. :)

[The Fallen]

I just started learning Javascript myself, so this may suck. But it works how you want it to. I think.:biggrin:

HTML Code:

<div id="DIVID">
<a href="#" onclick="RandomDiv();">Clicky</a>
</div>

CSS Code:

.tape
{
display: none;
}

Javascript:

function RandomDiv()
{
	var ranNum= Math.floor(Math.random()*10);

	document.getElementById('DIVID').innerHTML += "<div id='tape'class='tape'><a id='Link' href='#'>user</a></div>";
	var color=new Array(10)
	color[0]="COLOUR1";
	color[1]="COLOUR2";
	color[2]="COLOUR3";   
	color[3]="COLOUR4";
	color[4]="COLOUR5";
	color[5]="COLOUR6";
	color[6]="COLOUR7";
	color[7]="COLOUR8";   
	color[8]="COLOUR9";
	color[9]="COLOUR10";
	document.getElementById('Link').style.color = color[ranNum];
	document.getElementById('tape').style.display = "block";
}

[I am a noob]

Should produce a string starting with # followed by six random characters, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e or f.

Examples include:
#b3f45a
#56c375
#f06976

var i, random, string;

function RandomColour()
{
    string = "#";
    
    for (i = 0; i < 6; i++)
    {
        random = Math.floor(Math.random() * 16);
        
        if (random >= 0 && random <= 9)
        {
            string = string + random;
        }
        
        else if (random == 10)
        {
            string = string + "a";
        }
        
        else if (random == 11)
        {
            string = string + "b";
        }
        
        else if (random == 12)
        {
            string = string + "c";
        }
        
        else if (random == 13)
        {
            string = string + "d";
        }
        
        else if (random == 14)
        {
            string = string + "e";
        }
        
        else if (random == 15)
        {
            string = string + "f";
        }
    }
    
    alert(string);
}

[editline]08:06PM[/editline]

Oh yea, forgot to mention. Delete the alert(string); at the end, just for testing/showing the string.

[4Chan User]

My brain expwoded

:downs:

[andersonmat]

If you really want it random, this is more efficient.

function generateHex(){
	var hexChars = {"0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f"};
	var itemColor = "#";
	for (x = 0; x < 6; x++){
		itemColor += hexChars[Math.floor(Math.random() * hexChars.length)];
	}
	return itemColor;
}

[I am a noob]

[QUOTE=andersonmat;20940644]If you really want it random, this is more efficient.

function generateHex(){
    var hexChars = {"0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f"};
    var itemColor = "";
    for (x = 0; x < 6; x++){
        itemColor += hexChars[Math.floor(Math.random() * hexChars.length)];
    }
    return itemColor;
}

[/QUOTE]

Ow yeah, that is really tidier.
This one is better.

[editline]08:50PM[/editline]

Remember the #,

var itemColor = "#";

[turb_]

[QUOTE=I am a noob;20939840]

var i, random, string;

function RandomColour()
{
    string = "#";
    
    for (i = 0; i < 6; i++)
    {
        random = Math.floor(Math.random() * 16);
        
        if (random >= 0 && random <= 9)
        {
            string = string + random;
        }
        
        else if (random == 10)
        {
            string = string + "a";
        }
        
        else if (random == 11)
        {
            string = string + "b";
        }
        
        else if (random == 12)
        {
            string = string + "c";
        }
        
        else if (random == 13)
        {
            string = string + "d";
        }
        
        else if (random == 14)
        {
            string = string + "e";
        }
        
        else if (random == 15)
        {
            string = string + "f";
        }
    }
    
    alert(string);
}

[/QUOTE]

yuck.

this is how not to write code

[I am a noob]

[QUOTE=turb_;20951342]yuck.

this is how not to write code[/QUOTE]

Sorry :love:

[mdakin]

[QUOTE=I am a noob;20953059]Sorry :love:[/QUOTE]

Better learn from your mistake, boy.

[y0haN]

Case statement (switching) yo.

[turb_]

No not even a switch statement could save that code. Matching the number to the hex digit like that is just shit

[andersonmat]

[QUOTE=turb_;20953361]No not even a switch statement could save that code. Matching the number to the hex digit like that is just shit[/QUOTE]

I win. Mine's the best. :mmmsmug:

[TehDoomCat]

Why use hex when you could just use RGB?

function randomRGB() {
    var r = Math.floor(Math.random() * 255)
    var g = Math.floor(Math.random() * 255)
    var b = Math.floor(Math.random() * 255)
    return "rgb("+r+","+g+","+b+")";
}

[andersonmat]

[QUOTE=TehDoomCat;20956175]Why use hex when you could just use RGB?

function randomRGB() {
    var r = Math.floor(Math.random() * 255)
    var g = Math.floor(Math.random() * 255)
    var b = Math.floor(Math.random() * 255)
    return "rgb("+r+","+g+","+b+")";
}

[/QUOTE]

Because hex is for cool people. :cool:

[editline]02:01PM[/editline]

Also,

function randomRGB() {
    return "rgb(" + Math.floor(Math.random() * 255) + ", " + Math.floor(Math.random() * 255) + ", " + Math.floor(Math.random() * 255) + ")";
}

[editline]02:01PM[/editline]

Performance change is minuscule, but there.