Currently Browsing: Javascript

Creating a Hover Menu with HTML5 and Simpli5

A More Usable Application I decided to build my own version of a contextual hover menu to make my applications more usable. It is meant to appear when you select a piece of data and give you quick access to all the actions you might perform on it. Forget long toolbars and hidden right-click menus. I wanted something that a user didn't have to dig around to find, that wouldn't be hard to navigate, and that wasn't hidden (a right-click on the web is not common enough for users to rely on). I'll walk you through the beginning process I took to create the HoverMenu component using Simpli5 and then...read more
Page 1 of 212

Javascript Rollover Rollout Events

Javascript has mouseover and mouseout events. Flash has these, but they also have rollover and rollout events. There is a difference, and it can be painful developing Javascript components without the rollover and rollout events. So I put together a little script that provides them for us. Problem You want to perform some action when the cursor rolls onto and off of an HTML element. When you use the mouseover/mouseout events, you get a mouseout and immediately another mouseover when the cursor is over a child element. Technically the mouse is still over the parent element, why does the mouseout...read more
Page 1 of 212

Javascript Data Binding

Simpli5 has been coming along nicely as I've been able to put time into it. I'm very excited to announce data-binding. Data Binding Data binding is a technique we have and use in Flash quite a bit that allows one property to stay in sync with another. If obj.x is bound to obj.y then whenever obj.x is changed, obj.y will automatically update to the same value. I've built my own data binding frameworks in ActionScript 3 and I wanted it for my Javascript work as well. Since Simpli5 has a base-line of HTML5, I was easily able to create data binding in Javascript using implicit getters and setters....read more
Page 1 of 212

Simpli5, an HTML5 Javascript Framework

I've started putting together a new HTML5 Javascript framework that is only compatible with HTML5 browsers. I'm able to have a much smaller library that way, and I'm able to do stuff I couldn't otherwise. Like... Optimization Because I'm using built-in Javascript methods (written in C) for many things I do, I am taking advantage of the speed of modern HTML5 browsers, without the bloat of code that makes up for missing features. Array.prototype.slice is used to convert NodeLists and Argument objects into arrays with $.toArray(); querySelector and querySelectorAll are used to quickly find the first...read more
Page 1 of 212

Displaying Flash generated images in HTML <img/>, realtime

So there may not be an exorbitant amount of use-cases for displaying an image in HTML that was generated real-time in Flash, but I thought's cool, so I'm sharing anyway. It makes the inner-geek in me smile. Short background: I was looking into creating a Flash drawing app that consisted only of the canvas portion, with the rest of the UI in HTML. This is for many reasons including the size of Flex, the native OS components in the browser, speed, and hey, it forces separation of core app logic from the presentation logic, right? ;) So I wanted a way to display thumbnails of the pages of my drawing....read more
Page 1 of 212

Mint, Stat’s and Design

Mint is a new product recently released to track the statistics on your website. It has gotten much attention from several areas, and I thought it would be worth it to check it out. I am currently using StatCounter.com to track the traffic to my site. It is really useful when you use their paid service which keeps track of more than the last 100 visits to your site (the free version cap). It lets you view all the regular stats as well as "drill down" to see the actual path a single visitor took through your site. But, it is a monthly subscription service, which means potenially hundreds of...read more
Page 1 of 212