John Cox

Blogs · @wyome · Now · Shelf

Tagged tutorial · everything

Interesting

iOS6 gives us two new CSS3 properties | css3files.com

iOS 6 brings CSS3 filters and cross-fade support to mobile devices, expanding their practical use beyond the limited desktop browser adoption in Chrome and Safari. CSS3 filters enable powerful visual effects like blur and greyscale directly through stylesheets, making them immediately valuable for mobile apps, while cross-fade offers a less compelling option for blending images. Firefox and IE10 support remains uncertain, meaning widespread desktop deployment of these properties is still distant despite their maturity on WebKit-powered mobile platforms.

Permalink

CSS-Only Sticky Headers for Tables, Using ‘position: sticky’

The `position: sticky` CSS property keeps elements visible on-screen as the user scrolls, as long as their parent container remains in view—treating elements as relatively positioned normally, but switching to fixed positioning once they would scroll out of view. This is particularly useful for table headers and other recurring elements, requiring only a few lines of CSS rather than JavaScript, though browser support is currently limited to WebKit-based browsers with vendor prefixes required. The effect degrades gracefully in unsupported browsers, simply scrolling off-screen like normal content.

Permalink

WebKit HTML5 Search Inputs | CSS-Tricks

WebKit browsers apply special styling and features to HTML5 search inputs that are not standardized, including an inset border, rounded corners, and a clear button (×), but they also severely restrict which CSS properties can be modified—padding, font-family, border, and background are overridden regardless of !important rules. The search input supports undocumented WebKit attributes like `results` (to show previous searches with a magnifying glass icon) and `autosave` (to persist those searches across page reloads), plus custom events like 'search' that fires when users pause typing, but developers should be cautious about styling these inputs since their appearance varies significantly across browsers and they only support three discrete sizes based on font-size.

Permalink

Untitled (http://blog.bittersweetryan.com/2012/09/jquery-function-of-week-deferred-deep.html?spref=tw)

jQuery's Deferred object provides a way to manage callbacks for asynchronous operations, working similarly to making a phone call where you register what to do based on whether the call succeeds or fails. The article explains that Deferreds have two parts: callers (functions that initiate operations or respond to results using `when()`, `then()`, `done()`, and `fail()`) and callees (functions that return promises and eventually resolve or reject them). A real-world example demonstrates how using Deferreds to chain operations like fading out content, fetching tweets, and fading in new data keeps code decoupled and maintainable rather than nesting callbacks.

Permalink

Local Storage And How To Use It On Websites | Smashing Coding

Local storage in HTML5 allows developers to persistently store data on users' computers as a superior alternative to cookies, which are limited to 4 KB and add overhead to every page request. The article explains how to use the simple localStorage API (setItem, getItem, removeItem) with workarounds like JSON.stringify() for storing objects, and provides practical examples including caching slow web service calls to improve performance and maintaining interface state without requiring user login. It acknowledges the security risks of local storage, particularly demonstrated by exploits like Evercookie that can track users even when cookies are disabled.

Permalink

Using jQuery .on() and .off() – AndiSmith.com

jQuery 1.7 introduced `.on()` and `.off()` methods that unify all previous event handling approaches (`.bind()`, `.live()`, `.delegate()`, `.unbind()`, `.die()`, and `.undelegate()`) into a single, more efficient syntax. The `.on()` method attaches event handlers with flexible parameters for specifying event types, target selectors, and data, while `.off()` removes those handlers with matching specificity. The article provides migration guides for converting legacy code patterns to these new methods and introduces `.one()` for single-use event handlers.

Permalink

HTML5 download Attribute

HTML5's `download` attribute lets you specify a user-friendly filename for a link's destination file, separate from the actual server filename. This is particularly valuable for dynamically generated files that have cryptic names on the server side but need to appear meaningful to users in download dialogs. The attribute also forces browsers to download the file rather than attempting to open it, eliminating the need for server-side workarounds like PHP headers.

Permalink

Sundry MySQL Scripts and Docs

A collection of MySQL administration scripts that automate performance diagnostics and monitoring tasks. The MySQL Performance Tuning Primer analyzes server status variables to recommend optimal settings for connection limits, buffer sizes, and caching; complementary scripts track replication slave delays, monitor replication thread health, and automate hot backups of both MyISAM and InnoDB databases. The tools are designed to work across multiple MySQL versions (3.23 through 5.6) and various operating systems.

Permalink

A Beginner's Guide to Using the Application Cache - HTML5 Rocks

HTML5's Application Cache allows developers to specify which files browsers should persistently cache, enabling users to browse web applications offline, access them faster from disk storage, and continue using them even during server outages. The feature works through a manifest file (referenced in the HTML tag) that lists resources to cache, with additional NETWORK and FALLBACK sections for handling online-only resources and providing alternative content when resources fail to load. Developers can programmatically monitor and update the cache using the `window.applicationCache` object and its events, though the entire cache only refreshes when the manifest file itself changes—not when individual cached resources are modified.

Permalink

What does "size" in int(size) of MySQL mean? » alexander kirk » Blog Archive

The number in parentheses after numeric types like `INT(11)` specifies display width, not storage capacity—all `INT` values store the same range regardless of whether you write `INT(4)` or `INT(11)`. The display width only becomes functionally relevant when the `ZEROFILL` attribute is applied, at which point MySQL pads values shorter than the specified width with leading zeros (so an `INT(6) ZEROFILL` column displays `010000` instead of `10000`). Without `ZEROFILL`, the display width parameter has no practical effect, meaning values exceeding the width display fully and shorter values display normally.

Permalink

Lazy Load Plugin for jQuery

Lazy Load is a modern JavaScript library that defers image loading until they enter the browser viewport, using the Intersection Observer API to improve page performance on long pages with many images. The library supports multiple initialization methods (vanilla JavaScript or jQuery), optional low-resolution placeholders, responsive images via srcset, and can be configured through IntersectionObserver settings. It includes utility methods to force load all images or cleanly destroy the plugin instance.

Permalink

5 Ways to Boost MySQL Scalability

This article presents five practical techniques for improving MySQL database performance under growing traffic: optimizing slow queries using tools like EXPLAIN and the slow query log; setting up master-master replication to distribute read traffic across slave databases; configuring memory-related parameters like innodb_buffer_pool_size and key_buffer_size; using RAID 10 for disk I/O instead of the slower RAID 5; and tuning specific InnoDB settings like innodb_flush_log_at_trx_commit and innodb_file_per_table. The advice is grounded in common scalability problems the authors encounter with clients, emphasizing that most performance gains come from query optimization since many queries are functionally correct but not stress-tested for high loads.

Permalink

Untitled (http://mashable.com/2012/07/26/mountain-lion-clean-install/)

This guide walks through creating a bootable USB installer for OS X Mountain Lion, either manually using Disk Utility or with automated tools like Lion DiskMaker, as an alternative to upgrading through the Mac App Store for users who prefer a clean install. The process is nearly identical to the previous Lion clean install procedure, with the main difference being that the DMG file must be mounted before restoring to USB. Apple's Recovery Disk Assistant offers another option that can create bootable installation media and restore from Time Machine backups, though at the time of writing it only supported Lion.

Permalink