Need to know what script make this work. Help Please.....

**ahillworks** · Oct 22, 2011 23:59

I need to know what script can be used to change the following objects when Trick Button is clicked. The items are to be random and i already have a list i just don't know how to make them appear random. I know this works because a buddy made a page similar but won't tell me how he did it...... All the help is great. I think I have been reading articles all night so far I'm beat.

</head>
<body>

<div id="blackboard">
<div id="stance">Regular</div>
<div id="flip">360 shov-it</div>
<div id="direction">Backside</div>
<div id="grind">Boardslide</div>
<div id="ender">Laser flip</div>
<div id="trick_button" onClick="location.reload(true);"></div>

**diginetwork** · Oct 23, 2011 08:41

In the page first put only this:

<div id="blackboard">
</div>
<div id="trick_button" onClick="location.reload(true);"></div>

You can use something like <body onload="showRandomDivs()"> to invoke a javascript function when the page loads. In showRandomDivs() function you have to randomly add child elements to the 'blackboard' div using DOM appendChild() method. You can get more details here: http://w3schools.com/jsref/dom_obj_all.asp

**ahillworks** · Oct 23, 2011 09:50

Ok so how would i put this together. I kinda understand but I'm new to css this unfortunately looks greek to me

And thank you for replying.

**centered effect** · Oct 23, 2011 16:35

You can do it this way as well:

Here's a fiddle to try it out: http://jsfiddle.net/bhuVH/

HTML Code:

<!DOCTYPE html>
<html>
	<body>
		<button id="randomTrickButton">Randomize Tricks</button>
		<div id="blackboard"></div>
		<script>
			// From http://stackoverflow.com/questions/962802/is-it-correct-to-use-javascript-array-sort-method-for-shuffling/962890#962890
			function shuffle(array) {
				var tmp, current, top = array.length;

				if(top) while(--top) {
					current = Math.floor(Math.random() * (top + 1));
					tmp = array[current];
					array[current] = array[top];
					array[top] = tmp;
				}
				return array;
			}
			
			var trickArray = [], 
				i,
				bBoard = document.getElementById('blackboard'),
				trickBtn = document.getElementById('randomTrickButton');

			trickArray.push({id:'stance', txt:'Regular'});
			trickArray.push({id:'flip',txt: '360 shov-it'});
			trickArray.push({id:'direction',txt:'Backside'});
			
			// EventListener for non-IE browsers
			trickBtn.addEventListener(
				'click', 
				function(e) {
					bBoard.innerHTML = '';
					trickArray = shuffle(trickArray);
					for( i = 0; i < trickArray.length; i++ ) {
						var t = trickArray[i];
						bBoard.innerHTML += '<div id="' + t.id + '">' + t.txt + '</div>';						
					}
				}, 
				false
			);
		</script>
	</body>
</html>

**ahillworks** · Oct 23, 2011 18:20

Now I like the one that posted but will have to use that for something else.

Here is an example of what I'm looking at.
Screen Shot 2011-10-23 at 8.15.17 PM.png

I need the left words to be stationary and the right words to be random.

Example of random amounts.
Stance: Nollie, Regular
Flip: Shov-it, Impossible, Bigspin,
Direction: Backside, Frontside,
Grind/Slide: 50-50, Feeble Grind, N
Ender: Heelflip, Bigflip, Bigspin, Kickflip,

I will say I'm playing with that thing you posted it helps allot more than trying to get Dreamweaver to work in demo. I hate the fact i know only so little or basic of just html and nothing of css or java.

**centered effect** · Oct 23, 2011 20:49

picture awaiting approval.. can you use imageshack or similar and post the link?

if I remember correctly, a nollie isn't a stance....

**ahillworks** · Oct 23, 2011 21:12

http://imageshack.us/photo/my-images...1023at815.png/

Well its more Fingerboarding than Skateboarding so its a little differ. lol Thanks for your help so far.

**centered effect** · Oct 25, 2011 16:09

Originally Posted by ahillworks

I need the left words to be stationary and the right words to be random.

The above example would have to be tweaked but you can use similar code to make this happen.

User Tag List

Thread: Need to know what script make this work. Help Please.....

Thread Tools

Display

Need to know what script make this work. Help Please.....

Bookmarks

Bookmarks

Posting Permissions