nfg_Day12

Day 12
<< main | course director notes

code <!doctype html>
 * 2. Using jQuery to change z-index**

 width:960px; height:540px; position:absolute; left:0px; top:0px; right:0px; bottom:0px; margin:auto; border:1px solid green; }
 * 1) container{

.box{ width:100px; height:100px; position:absolute; }

background:red; left:10px; top:10px; }
 * 1) box1{

background:blue; left:50px; top:50px; }
 * 1) box2{

background:green; left:100px; top:100px; }    var box1Z = 0; var box2Z = 0; var box3Z = 0;
 * 1) box3{

function setup{ $("#box1").click(box1Handler); $("#box2").click(box2Handler); $("#box3").click(box3Handler); }

function box1Handler{ box1Z=1; box2Z=0; box3Z=0; updateZ; }

function box2Handler{ box1Z=0; box2Z=1; box3Z=0; updateZ; }

function box3Handler{ box1Z=0; box2Z=0; box3Z=1; updateZ; }

function updateZ{ $("#box1").css({"z-index": box1Z}); $("#box2").css({"z-index": box2Z}); $("#box3").css({"z-index": box3Z}); }

$(setup);

code

code <!doctype html>
 * 1. Processing.js review with vertical centering**



width:960px; height:540px; position:absolute; left:0px; top:0px; right:0px; bottom:0px; margin:auto; border:1px solid green; }
 * 1) container{

width:640px; height:480px; position:absolute; left:0px; top:0px; right:0px; bottom:0px; margin:auto; border:1px solid red; } 
 * 1) player{



code