Posts

Showing posts from September 8, 2019

heart with gradient background

Image
<!DOCTYPE HTML> <html> <head> <script> window.onload = function() { var canvas = document.getElementById("myCanvas"); var context = canvas.getContext("2d"); ////////////////////////////////////// start below this line ˇˇˇˇˇˇˇˇˇˇ context.beginPath(); context.rect(0, 0, canvas.width, canvas.height); //Midnight gradient var grd = context.createLinearGradient(400, 0, 400, 600); // dark blue grd.addColorStop(0, "rgb(140, 230, 250)"); // lighter blue grd.addColorStop(1, "rgb(321, 160, 221)"); context.fillStyle = grd; context.fill(); context.stroke(); //Heart //Bezier Curve Variables var Ax = 360; var Ay = 200; var Bx = 360; var By = 500; var control1x = 160; var control1y = -50; var control2x = 40; var control2y = 300; var control3x = 730; var control3y = 300; var control4x = 560; var control4y = -50; context.beginPath(); context.moveTo(Ax, Ay); context.bezierCurveTo(control1x, cont

dreamweaver project 1

Image
https://www.youtube.com/watch?v=83L6B13ixQ0 https://www.youtube.com/watch?v=3GqUM4mEYKA https://www.youtube.com/watch?v=SNHHUmDWltU code: <!doctype html> <html> <head> <meta charset="UTF-8"> <title>Untitled Document</title> </head> <body> </body> </html> <!DOCTYPE HTML> <html> <head> <script> window.onload = function() { var canvas = document.getElementById("myCanvas"); var context = canvas.getContext("2d"); ////////////////////////////////////// start below this line ˇˇˇˇˇˇˇˇˇˇ //Simple V line in pink var x= 50; var y = 70; var x1 = 200; var y1 = 350; var x2 = 250; var y2 = 300; var x3 = 300; var y3 = 350; var x4 = 350 var y4 = 70 //comment context.beginPath(); context.moveTo(x, y); context.lineTo(x1, y1); // move to starting coordinates context.lineTo(x2, y2); // draw line to following point context.lineTo(x3, y3); co