jquery - How create follows mouse movement - javascript? -
i'm beginner @ coding. want effec on page - http://tympanus.net/development/animatedheaderbackgrounds
i use scripts site , greensock gsap animation library. can't connect site. html:
<div id="container"> <canvas id="demo-canvas" width="1400" height="622"></canvas> </div> and part of javascript use id elements:
largeheader = document.getelementbyid('container'); largeheader.style.height = height+'px'; canvas = document.getelementbyid('demo-canvas'); canvas.width = width; canvas.height = height; ctx = canvas.getcontext('2d'); when use javascript code, error "typeerror: largeheader null".
how correctly use effect ?
is code either
- a) @ end of
<body>element, or - b) wrapped in dom ready handler?
otherwise referencing dom element before exists.
this 1 way wrap dom ready (shortcut handler locally scoped $):
jquery(function($){ var largeheader = document.getelementbyid('container'); largeheader.style.height = height+'px'; var canvas = document.getelementbyid('demo-canvas'); canvas.width = width; canvas.height = height; var ctx = canvas.getcontext('2d'); }); notes:
- the traditional dom ready handler
$(document).ready(function(){ code });shortcut nicer - also use
vardeclare local variables. otherwise pollute global scope.
Comments
Post a Comment