I’ll Take That Text Extra Large: Bigify It

Some people like to spend their long airplane time watching movies or playing phone games. That’s fine. Me, I usually sleep, but on my cross country flight yesterday I wanted to try building a little HTML/jQuery tool.

Because it’s something I can use this week.

Because I can (running in my laptop’s localhost).

Well almost. I lacked the internet to look up more of the code I got wrong. But I got about 80% there.

Presenting… Bigify. The thing it does?

There is a small form field at the bottom; whatever is typed or pasted there is “bigified” on the main display.

Stunning, eh?

I have a few days this week of hand on web workshops; I won’t be doing slides, mostly web demos. There is this part when I want to have everyone go to the same site, I will make shirt URLs, but still, it seems useful to display them as Big On Screen as Possible.

There are a number of jQuery code bits to dynamically resize text to a window size, I decided to try FitText, that is what I downloaded before my trip. I also made sure I had a local copy of jQuery as served by Google just so I could play while not connected.

There’s a lot of room for improvement; I wanted to make the form field disappear when not being edited, but the show/hide jQuery worked to hide, but never to show (same with CSS hover tricks, maybe it’s the absolute positioning??). Maybe it could use query parameters to save pre-configured strings as URLs. Maybe some options for different display colors (light text a black background for contrast??).

Got ideas? Fork this thing!

Who knows? I have a flight home Wednesday, maybe I will do an update.

Update

Thank for John Johnston or forking and putting into play better interface- a form field element that replaces the display text, so it feels like editing it right in place.

SOme more tweaks coming output, but this now uses a better fonf on mobile devices (I hope).


Featured Image: Large Order Of Toast flickr photo by JD Hancock shared under a Creative Commons (BY) license

from CogDogBlog http://ift.tt/2w4GutU
via IFTTT

Advertisements

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