Skip to main content

Posts

Exercise 11: Counting Games (Finals Interactive)

  (CODE FOR HTML:) <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title> Exercise 11: Counting Drill Game  </title> <style> html { font-family: Consolas; margin-left: 4%; background-color: #cbc6dc;     }        body { max-width: 800px; min-width: 480px;     } fieldset { background-color: white; } button { background-color: ##c4a59f; color: black; border-radius: 50%; width: 100px; height: 100px; } </style> </head> <body> <h1>COUNT THE SHAPES</h1> <p> THIS IS EXERCISE TO LEARN YOU HOW TO COUNT. "PRACTICE MAKES YOU PERFECT"</p> <fieldset> <canvas id="myCanvas" width="1200" height="300" style="border:none;"> </canvas> <label> How many shapes do you see? </label> <input type="number" id="answer"> </input> <!-- <button id...

Exercise 11: YouTube Video Link Parameters (Finals Web Prog)

(Code for HTML:) <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title> Youtube Videos Link Parameters </title> <link rel="stylesheet" href="Exercise11iFrameVideo.css"> </head> <body> <div class="navbar"> <a href="#home">Home</a> <a href="https://scontent.fmnl19-1.fna.fbcdn.net/v/t1.6435-9/183696100_2901575863495019_8667639209325296233_n.jpg?_nc_cat=100&ccb=1-3&_nc_sid=0debeb&_nc_eui2=AeGmZRPZmRmXrOArSHq09vPIKfIhC24RAaYp8iELbhEBpvFlFRJZ9cKWpyHOm3J-Tle-7AutVdLWleXZ1XrgIqBW&_nc_ohc=HTCL7Rxi8jAAX8t6M2L&_nc_ht=scontent.fmnl19-1.fna&oh=98676492910e87038adfb8cd76772c33&oe=60BD0C01" target="Jillian Dela Cruz">About</a> <a href="https://scontent.fmnl19-1.fna.fbcdn.net/v/t1.6435-9/184092486_2901582303494375_8241790509753611562_n.jpg?_nc_cat=102...

Exercise 10: Drawing in Canvas (Finals Interactive)

 (CODE FOR HTML;) <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Exercise 10 Drawing In Canvas </title> </head> <body> <canvas id="myCanvas" width="1345.5" height="603.5" style="border:1px solid #000000;"> </canvas> <script> var canvas = document.getElementById("myCanvas"); var ctx = canvas.getContext("2d"); ctx.globalAlpha = 0.8 ctx.fillStyle = "#cbc6dc"; ctx.fillRect(500,110,283,353); ctx.fillStyle = "#e8b1a9"; ctx.fillRect(520,128,230,300); ctx.fillStyle = "#00aeff"; ctx.beginPath(); ctx.fillStyle = "#e0defa"; ctx.fillRect(520,403,245,50); ctx.fillStyle = "#aba4a4"; ctx.fillRect(520,403,245,10); </script> </body> </html>

Exercise 10: Animation (Finals Web Prog)

(Code for HTML:) <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Exercise 010 Animated Web page</title> <link rel="stylesheet" href="Exercise10AnimatedWebpage.css"> </head> <body> <div> <h1 style="font-size:40px;"> ABOUT MYSELF  </h1> </div> <br> <br> <br> <br> <br> <br> <br> <br>  <p style="text-align: justify; text-indent: 50px;">  Hi I'm Jillian Marren Dela Cruz. You can call me "Jill or Jillian" i'm currently 3rd year Multimedia Arts Student. 20 years of Age. I chose multimeida because i want to enchance my skills and i'm willing to learn about everything. I'm November Babies and My zodiac sign is Sagittarius. The Sagittarius Traits is Curious and energetic, Sagittarius is one of the biggest travelers among all...

Exercise 9: Iframe & Drop Down Menu

  CODE FOR HTML; <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title> Iframe & Drop Down Menu </title> <link rel="stylesheet" href="Exercise9iframe&dropdown.css"> </head> <body> <div class="navbar"> <a href="#home">Home</a> <a href="https://scontent.fmnl19-1.fna.fbcdn.net/v/t1.6435-9/183696100_2901575863495019_8667639209325296233_n.jpg?_nc_cat=100&ccb=1-3&_nc_sid=0debeb&_nc_eui2=AeGmZRPZmRmXrOArSHq09vPIKfIhC24RAaYp8iELbhEBpvFlFRJZ9cKWpyHOm3J-Tle-7AutVdLWleXZ1XrgIqBW&_nc_ohc=HTCL7Rxi8jAAX8t6M2L&_nc_ht=scontent.fmnl19-1.fna&oh=98676492910e87038adfb8cd76772c33&oe=60BD0C01" target="Jillian Dela Cruz">About</a> <a href="https://scontent.fmnl19-1.fna.fbcdn.net/v/t1.6435-9/184092486_2901582303494375_8241790509753611562_n.jpg?_nc_cat=10...

Exercise 8: CSS Side Bar Navigation

CODE FOR HTML; <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>CSS Sidebar Navigation Exercise</title> <link rel="stylesheet" href="Exercise008webProgram2ChangeBut.css"> </head> <body> <section id="home"></section> <div class="header"> <div class="header-text"> <h1 style="font-family: Consolas; font-size: 75px;"> My Artworks </h1> </div> </div> <div class="sidenav"> <a href="#home">HOME</a> <a href="#about">About</a> <a href="#description">Desciption</a> <a href="#contact">Contact</a> </div> <div class="main"> <section id="about"></section> <p> <b> About </b> </p> <p style=...

Execise 8: : Change Button Properties Onchange Event (Interactive)

  CODE FOR HTML; <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Change Button Properties</title> <link rel="stylesheet" href="Exercise8ChangeButton.css"> </head> <body> <fieldset> <h1> Change Button Properties Onchange Event </h1> <h3> Enter Color: </h3> <input type="text" id="input1"/> <br> <h3> Enter number: </h3> <input type="number" id="input2" onchange="onchangeevent()"/> <br> <br> <br> <input class="btn" type="button" id="display1"> <input class="btn" type="button" id="display2"> <input class="btn" type="button" id="display3"> <input class="btn" type="button" id="display...