Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript jQuery Basics (2014) Creating a Simple Drawing Application Perfect

Sean Pierce Sumler
Sean Pierce Sumler
18,968 Points
Posted by Sean Pierce Sumler
Sean Pierce Sumler
18,968 Points

Expanding on the drawing application

Hi everyone. I've completed the "Creating A Simple Drawing Application" in the jQuery basics section. It was a lot of fun so I decided to expand on the project.

I successfully included a slider to change the width of the "brush"

Now I'm wondering if there is any way I can reformat this for mobile. It seems as though the mouse functions used in the jQuery script won't work for iOS or Android. I've searched this topic but I couldn't find anything that seemed relevant to this case.

I uploaded my code to codepen if anyone wants to take a look http://codepen.io/seanpierce/pen/yYpdOw

If anyone can help point me in the right direction I would really appreciate it. Thanks!

1 Answer

rydavim
rydavim
18,813 Points
rydavim
rydavim
18,813 Points

Your CodePen link doesn't seem to be working for me, so I'll try to give some general pointers that you can investigate.

I believe you could use the vmousedown, vmouseup, and vmousemove events from jQuery Mobile. You can find documentation for those methods here. If you want to test this, you can get started quickly without having to download anything by using Google's CDN.

Let me know if you run into any snags, and I'll do my best to help work them out. Happy coding! :)

Sean Pierce Sumler
Sean Pierce Sumler
18,968 Points
Sean Pierce Sumler
Sean Pierce Sumler
18,968 Points

Thanks rydavim! I'll look at this right now. I'm not sure why the link doesn't work. Here is another one http://codepen.io/seanpierce/full/yYpdOw/

I appreciate your help!

rydavim
rydavim
18,813 Points
rydavim
rydavim
18,813 Points

Looks like the CodePen links work if you take the &#13 off the end.

The touch addition looks like it's a bit more complicated than I originally thought. I've got to go to work, but I'll investigate more later today and get back to you.

rydavim
rydavim
18,813 Points
rydavim
rydavim
18,813 Points

There is a really informative article on Zipso working with a very similar example. I would highly recommend taking a look if you get stuck in your tinkering.

Happy coding! :)

Sean Pierce Sumler
Sean Pierce Sumler
18,968 Points
Sean Pierce Sumler
Sean Pierce Sumler
18,968 Points

Thanks for the Zispo article. I'll look at that right now. Again, I really appreciate it! -Sean