2016-06-07 Animation Gif Code

I started at google.com this morning and it says:

It’s World Emoji Day!

This is one of the code projects that you can ‘play’ with. Great for kids. I used this: Made With Code Projects Gif

Here’s what I made with the animator project:

Unfortunately, it did not animate at first. What’s wrong? Basically, the width default crops the animation because these gifs are animated by using a series of snapshots or FRAMES. So you should use the SIZE-FULL option when inserting the media. I learned this trick (or bug fix) from this guy, who also recommends taking off the LINK to the media which is also defaulted. Blogging Handbook Uploading Animated Gifs

I also wanted to use my selfie with makeup – to ASSESSORIZE (another project), but uploading background was disabled. Ah, mmh… so try this instead!

Note: All images are put in the post with width and height set at 150 each. Though the images vary in size the displayed size looks the same. This is scaling. When you import the media, you determine the link and the size option. In this case, emoji is thumbnail, animation is full and selfie is medium. Since the others were not animated, it makes no difference. I also changed the

CLASS=alignnone to alignleft, alignright, aligncenter respectively for the images and added “float: right; and margin: 10px;” inside the image tag

to wrap the text around the images. Source: Result of google search: “wrap text around image HTML5”

If you are interested coding or getting your kids involved, be sure to check out the coding projects links at the bottom of the page, for example: MIT’s Scratch Oh, dear, I could play all day.