8. January 2014

The story behind PF2014 – Cordova – slides


Slides available in formats: PDFSlideShare

Web version: http://pf2014.sinusgear.com
Mobile versions: Android, App Store, Amazon
Source code: GitHub

22. December 2013

Tracing Paper JS – tool for generating JavaScript coordinates from image

Tracing paper is common tool for illustrators and graphic designers.

I wrote a tool which is able to convert clicks on image into coordinates and use it in JavaScript.

Launch Tracing Paper JS in full screen mode

Just click at the image and tool will record set of coordinates as JavaScript code.

It’s simple app written in JavaScript with AngularJS.

Source code is available at Github: https://github.com/georgik/tracing-paper-js

14. May 2013

How to debug :hover pseudo class in Google Chrome Developer tool

Google Chrome developer tool is simply one of the best tools available for debugging of HTML5 applications.

It has one neat feature: possibility to inspect CSS of element and editing it on the fly.

That works fine for normal styles, but what about :hover state?

There is one “hidden” option which allows to switch element to :hover state.

Inspect element of HTML. You should see Styles on the right hand side. There are 3 icons. Click the middle one with arrow sign. It will pop up menu with checkboxes. You can select here CSS pseudo classes like :active, :focus, :hover or :visited.

google-chrome-dev-hover

To learn more about capabilities of Google Chrome developer tools I recommend to go through free course Discover Dev Tools from Codeschool.com.

20. January 2013

Edge Animate – first experiment

New Adobe Edge Animate looks pretty good. Here is my small experiment:

13. January 2013

3D HTML inspection in Firefox

Firefox has one very neat feature for web developers – 3D inspection. It’s very useful when you need to examine layer overlay or event bubbling.

Just right click and choose Inspect Element:

firefox-inspect

You’ll switch to inspect mode. Click 3D View in the right bottom corner.

firefox-3d

Simple 🙂

  • Quick search

  • Links

  • Twitter

    Follow @jurajmichalek on twitter.

  • Comments

  • Tags

  • Topics