1 Reply Latest reply on Feb 25, 2013 2:24 PM by TimJaramillo

    Mouse click possibilities

    jessw8668

      Hi,

       

      I'm looking to do something for a friend of mine, but I wasn't sure if it was possible to do in HTML5 (ie. Edge). What I want is a webpage that opens to be covered in flowers and for the person on the webpage to be able to essentially "pick" the flowers by clicking on each one individually. When the flower is clicked, I want it to move towards wherever the mouse is positioned, and for them to add up each time a flower is clicked - creating kind of a bunch just under the mouse (or possibly behind it). The gradually building bunch should follow the mouse around as the user continues clicking/picking the rest of the flowers until the screen is empty, at which point I'd want something to happen to the bunch, like they move into a now visible vase in the bottom corner of the screen.

       

      I realise that's quite specific, but I was wondering if HTML5 did any of these things in terms of objects reacting to the mouse in this way, and how to do them if it did. I think I've seen some HTML5 mouse trails around (although looking at the code, all I can see is javascript), and I'm thinking it's kind of similar. Anyway, if anyone could help me, that'd be great

       

      Jess x

        • 1. Re: Mouse click possibilities
          TimJaramillo Level 4

          Hi Jess, this is definitely possible in Edge.

           

          What you will want to do is break down each chunk of functionality and put it together one piece at a time.

           

          You should be able to find info on each piece of the puzzle if you search this forum. Also remember that Edge runs on javascript, so if Edge doesn't have a particular functionality built-in, you can always roll your own code using javascript, jQuery etc.

           

          In your search, I would break your project down into these functional chunks:

          - call a function when clicking on an object.

          - make an Edge symbol follow the user's mouse