nfg_day2

code <!doctype html>
 * Ex.3**

 width:100px; height:100px; position:absolute; left:100px; top:100px; background:red;  var bob; var bobBorder=2; var bobRot = 0; var frameRate = 60; var drawRate = (1/frameRate)*1000; function setup{ bob = document.getElementById("bob"); bob.onmousedown = mary; bob.onmouseup = louis; draw; }	function draw{ bob.style.MozTransform = "rotate("+bobRot+"deg)"; bobRot++; setTimeout(draw,drawRate); }	function mary{ bob.style.left = 110+"px"; bob.style.border = bobBorder+"px solid black"; bobBorder++; console.log("bobBorder: " + bobBorder); }	function louis{ bob.style.left = 100+"px"; }	window.onload = setup;
 * 1) bob{

code

code <!doctype html>
 * Ex.2**

 width:100px; height:100px; position:absolute; left:100px; top:100px; background-image:url('photo3.jpg'); -moz-border-radius:10px; } background-image:url('photo15.jpg'); border:3px dotted green; -moz-border-radius:40px; } background-image:url('photo23.jpg'); width:110px; left:500px; }
 * 1) bob{
 * bob:hover{
 * bob:active{

code

code PImage bob; float posX = 320; float posY = 240; float bobWidth, bobHeight;
 * Ex.1**

void setup{ size(640,480); bob = loadImage("photo3.jpg"); bobWidth = bob.width; bobHeight = bob.height; }

void draw{ background(150); if(mousePressed){ bobWidth++; bobHeight++; posX = mouseX; posY = mouseY; } imageMode(CENTER); image(bob,posX,posY,bobWidth,bobHeight); if(mousePressed){ noFill; stroke(255,0,0); rectMode(CENTER); rect(posX,posY,bobWidth,bobHeight); } if(!mousePressed){ if(bobWidth>bob.width){ bobWidth--; }   if(bobHeight>bob.height){ bobHeight--; } } } code