'Call javascript effect from within js code
My js script has a condition in it, whereby if there is one player left, the screen is made full size and the name is in a huge font. I also want to add the confetti effect I have found on codepen.io. This effect 'drops' confetti over the text on the screen but the effect is called from an html page using <canvas id="confetti"></canvas>.
How do I change this so that I can call it form the following section in my script, such that the name on the screen is still visible? (code is available at Confetti) `
if(heatDriverData.d.length == 1){
window.resizeTo(1920,1080);
name = heatDriverData.d[0].nn;
championship = trackData.n;
// Create a new table for each group
//var t=document.createElement('table');
t.style.width = document.body.clientWidth-1+'px';
t.style.borderCollapse = 'collapse';
t.style.cellPadding = '5px';
var th = document.createElement( "th" );
th.style.color = headerColour;
th.style.fontSize = "40pt";
th.style.border= theBorderWidth + borderColour;
th.appendChild(document.createTextNode(championship));
t.appendChild(th);
// Create a table record for the winning driver
var tr=document.createElement('tr'); //create variable 'tr' to create a table row
tr.style.backgroundColor = "transparent";
tr.style.color = textColour;
var tdName=document.createElement('td'); //create variable 'tdName' to create a table cell with data
tdName.style.textAlign='center';
tdName.style.fontSize = "120pt";
tdName.style.color = "red";
tdName.style.border=theBorderWidth + borderColour;
tdName.appendChild(document.createTextNode(name));
tr.appendChild(tdName);
t.appendChild(tr);
// Create the table objects in the liverace div
if (liverace.firstChild){
liverace.removeChild(liverace.firstChild);
}
liverace.appendChild(t);
}
Thanks
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
