Feeding My Curiosity: JQuery

Experimenting can lead you to some funny discoveries. From my previous post I mentioned that I have been learning some JQuery and JavaScript. So roughly two days ago after finishing this video tutorial on JQuery sliders I thought, “Hm, what kind of effects can I accomplish with this? If I speed this up, can I make a stop motion effect? Make it like a .gif?”. Hungry for results, I set out to feed my curiosity. I hastily opened up CodePen and got typing.

What I found out from this “mini experiment” is that yes, you can indeed create a stop motion effect by using photos that show your subject moving in small increments between each frame. I achieved this by simply taking what I had learned from the tutorial and simply reducing the, animationSpeed to 0 (You can change the animation speed by increasing this value). This is because I basically decreased the “duration” of the slide animation to 0 milliseconds. Honestly, when I think about it…it seems kind of useless to think of it as a “slider” at this point since I’m basically omitting the “slider” aspect. However, it’s not completely useless in a sense that I learned to look at things from a different perspective and that sometimes unconventional methods can help you achieve your desired goal. Aside from that I don’t know if I recommend this method because I think it will affect the performance of your website and slow it down (It does keep your images crisp though as opposed to animating it and then exporting it as a .gif).

So, from this little brain blast that I had, my “main take aways” are:

  • There are different ways that elements can be manipulated using JQuery that gives the same effects
  • JQuery is powerful and can be really fun to fiddle around with
  • There are many ways a problem can be solved and sometimes unconventional methods can help you achieve your desired goals

If you’re interested in more of my work or material I had used to accomplish this please visit:
My Personal Website
My CodePen
Twitter (for some of my UI work)
The video tutorial I watched before carrying out my “experiment”

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s