Using Geolocation - HTML5 Foundations - page 278

ctx.beginPath();
ctx.moveTo(40, lineY);
ctx.lineTo((lineLength + 40), lineY);
}
7. Now set the line width to be 1.0.
function drawAdvert() {
...
// Add the separator line
var lineLength = 360;
var lineY = (adCanvas.height / 2) + 0.5;
ctx.beginPath();
ctx.moveTo(40, lineY);
ctx.lineTo((lineLength + 40), lineY);
ctx.lineWidth = 1.0;
}
8. Set the line color to rgba (255, 255, 255, 0.4) , which is semitransparent white:
function drawAdvert() {
...
// Add the separator line
var lineLength = 360;
var lineY = (adCanvas.height / 2) + 0.5;
ctx.beginPath();
ctx.moveTo(40, lineY);
ctx.lineTo((lineLength + 40), lineY);
ctx.lineWidth = 1.0;
ctx.strokeStyle = “rgba(255,255,255,0.4)";
}
9. Finally, stroke the path using the stroke() function.
function drawAdvert() {
...
// Add the separator line
var lineLength = 360;
var lineY = (adCanvas.height / 2) + 0.5;
ctx.beginPath();
ctx.moveTo(40, lineY);
ctx.lineTo((lineLength + 40), lineY);
ctx.lineWidth = 1.0;
ctx.strokeStyle = “rgba(255,255,255,0.4)";
ctx.stroke();
}
10. Save the adscript.js file.