Comments on: HTML5 Canvas Elastic Stars with KineticJS

By: Hesam

Hesam — Wed, 07 Nov 2012 16:48:25 +0000

Hi Eric,

Thank you for tutorial. Question: How can I use these stuff instead of regular HTML forms? is there any solution for? for example when user dragged n dropped something, can I call PHP scripts like $_GET or $_POST??

By: brishti

brishti — Sun, 24 Jun 2012 06:51:02 +0000

Sorry if it’s silly but i can’t add a simple text/ title to this using normal text function for HTML5. it would be helpful if you could let me know how can i add a title to this. thank you :)

By: brishti

brishti — Sun, 24 Jun 2012 02:43:57 +0000

Thank you for your suggestion :) I’m really new in the world of programming and so on HTML5 and Kineticjs. all of your tutorials have been very helpful for learning. thank you :)

By: Eric Rowell

Eric Rowell — Sat, 23 Jun 2012 20:56:04 +0000

@brishti try using a transition. more on that here:

http://www.html5canvastutorials.com/kineticjs/html5-canvas-linear-transition-tutorial-with-kineticjs/

By: brishti

brishti — Sat, 23 Jun 2012 11:11:05 +0000

could you please tell me how can I add a falling star effect with those stars? And I also don’t understand the function of ‘tango’. Thank u :)

By: fravia

fravia — Fri, 01 Jun 2012 19:25:16 +0000

Thank you for that reply Eric! Appreciate it!

By: Eric Rowell

Eric Rowell — Fri, 01 Jun 2012 16:32:29 +0000

@fravia absolutely. One of KineticJS’s strengths is that it works great for mobile devices as well. You can bind touchstart, touchend, touchmove, and dbltap. The tap event will be released in the next version. Drag and drop automatically works for both desktop and mobile apps. Here’s a tutorial on mobile events:

http://www.html5canvastutorials.com/kineticjs/html5-canvas-mobile-events/

By: fravia

fravia — Fri, 01 Jun 2012 13:11:44 +0000

Hi Eric, A very nice tutorial there indeed! Thank you so much! But have a question, please pardon if it is a noob one :P

Would this drag and drop action work on a touch interface device such as an iPad?

By: Eric Rowell

Eric Rowell — Fri, 25 May 2012 17:24:58 +0000

@klinger just replace dragstart with mousedown and touchstart :)

star.on(‘dragstart’) –> star.on(‘mousedown touchstart’);

at the end of the .on() function you’ll also need to draw the layer:

layer.draw();

By: klinger

klinger — Fri, 25 May 2012 16:43:39 +0000

Thank you Eric, KineticJS is an amazing tool. Question- in this example, the stars expand in size only after a move has begun. How could this be changed so that the stars expand as soon as you touch/click on them? (This would offer immediate UI feedback to a user that they’ve touched/clicked the object)