category


Comments

Post a Comment

Popular posts from this blog

Hide mouse on canvas in Javascript

< ! DOCTYPE html > < html > < head > < script type= 'text/javascript' src= 'http://code.jquery.com/jquery-1.9.1.js' > </script> < style type= 'text/css' > canvas{ border :1px solid red;} </style> < script type= 'text/javascript' > $(window).load(function(){ $( "#theCanvas" ).click(function () { alert( "You clicked the canvas with an invisible mouse!" ); $( "#theCanvas" ).css( "cursor" , "none" ); }); }); </script> </head> < body > < p ">Click the red canvas and I'll hide the cursor when you are over me </p> < canvas id= "theCanvas" > </canvas> </body> </html>
Read more

Draw animated loading spinner canvas in Javascript

< ! DOCTYPE html > < html > < head > < script type= 'text/javascript' src= 'http://code.jquery.com/jquery-1.8.3.js' > </script> < script type= 'text/javascript' > $(window).load(function(){ (function() { setInterval(draw, 30); var degrees = 0.0; var offset = 8; function draw() { var canvas = document.getElementById( 'tutorial' ); if (canvas.getContext) { var ctx = canvas.getContext( '2d' ); ctx.clearRect(0, 0, 16, 16); degrees += 0.10; ctx.save(); ctx.translate(offset, offset); ctx.rotate(degrees); // Draw half open circle ctx.beginPath(); ctx.lineWidth = 2; ctx.arc(8-offset , 8-offset, 6, 0, 1.75 * Math.PI); ctx.stroke(); // Draw arrowhead ...
Read more

Add close button to dialog in website

< ! DOCTYPE html > < html > < head > < script type= 'text/javascript' > window.onload=function(){ Dialog_header.onclick = function(e) { $( "#Dialog" ).fadeOut(500); }; Button1.onclick = function(e) { var $dialog = $( "#Dialog" ); if (!$dialog.hasClass( 'ui-dialog' )) { $dialog.page(); } $dialog.fadeIn(500); }; Button2.onclick = function() { $( "#Dialog" ).fadeOut(500); }; } </script> < link rel= "stylesheet" href= "http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" /> < script src= "http://code.jquery.com/jquery-1.7.1.min.js" > </script> < script src= "http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js" > </script> </head> < body > < div data-role= "page" id= ...
Read more