jQuery 1.7 Released
november 2011 by hanicker
You'll probably start seeing .on() and .off() on tutorial sites so just a heads up, that's new syntax for event binding in jQuery (although all the old methods still work too).
Direct Link to Article — Permalink
jQuery 1.7 Released is a post from CSS-Tricks
Link
from google
Direct Link to Article — Permalink
jQuery 1.7 Released is a post from CSS-Tricks
november 2011 by hanicker
Amazon Silk
september 2011 by hanicker
Listen to the engineers behind Amazon's new "Silk" web browser talk about how it uses the cloud to take the load off mobile devices.
Sounds like it does all the asset-requesting for you from the cloud, optimizes it, then sends you down one file that gets rendered into a website. Sounds clever to me, as long as it's secure as hell.
Rumor has it: WebKit based.
Direct Link to Article — Permalink
Amazon Silk is a post from CSS-Tricks
Link
from google
Sounds like it does all the asset-requesting for you from the cloud, optimizes it, then sends you down one file that gets rendered into a website. Sounds clever to me, as long as it's secure as hell.
Rumor has it: WebKit based.
Direct Link to Article — Permalink
Amazon Silk is a post from CSS-Tricks
september 2011 by hanicker
Sencha Looks at IE 10
september 2011 by hanicker
Michael Mullany:
...the IE10 HTML5 experience is one of the best we’ve seen on any platform to date.
I've heard from a number of folks that IE 10 will be the most advanced browser to date (support the most standards and new features). We'll see if this stays true when it actually ships.
Notable: transitions, transforms (2D and 3D), animations, shadows, gradients, flexbox and SVG filters.
Direct Link to Article — Permalink
Sencha Looks at IE 10 is a post from CSS-Tricks
Link
from google
...the IE10 HTML5 experience is one of the best we’ve seen on any platform to date.
I've heard from a number of folks that IE 10 will be the most advanced browser to date (support the most standards and new features). We'll see if this stays true when it actually ships.
Notable: transitions, transforms (2D and 3D), animations, shadows, gradients, flexbox and SVG filters.
Direct Link to Article — Permalink
Sencha Looks at IE 10 is a post from CSS-Tricks
september 2011 by hanicker
AnythingZoomer Plugin
august 2011 by hanicker
My AnythingZoomer jQuery demo has been plugin-ized by Mottie (who also maintains the AnythingSlider). It has some new features and is easier to work with by nature of being a plugin.
Direct Link to Article — Permalink
AnythingZoomer Plugin is a post from CSS-Tricks
Link
from google
Direct Link to Article — Permalink
AnythingZoomer Plugin is a post from CSS-Tricks
august 2011 by hanicker
Bootstrap
august 2011 by hanicker
HTML/CSS framework from Twitter (Mark Otto and Jacob Thornton). Pretty comprehensive: nice clean design and typography, grid system (fluid or fixed), form elements, buttons/navigation, alerts, tooltips, LESS support... I think a web app startup could do a lot worse than starting with this to get up and running quickly.
Direct Link to Article — Permalink
Bootstrap is a post from CSS-Tricks
Link
from google
Direct Link to Article — Permalink
Bootstrap is a post from CSS-Tricks
august 2011 by hanicker
Deck.js
august 2011 by hanicker
Pretty sweet slide deck framework that works in the browser by Caleb Troughton.
This is damn impressive too.
Direct Link to Article — Permalink
Deck.js is a post from CSS-Tricks
Link
from google
This is damn impressive too.
Direct Link to Article — Permalink
Deck.js is a post from CSS-Tricks
august 2011 by hanicker
Chosen
july 2011 by hanicker
Super hot jQuery and Prototype plugin by the Harvest team that seriously improves the UI of <select> elements.
Direct Link to Article — Permalink
Advertise here with BSA
Chosen is a post from CSS-Tricks
Link
from google
Direct Link to Article — Permalink
Advertise here with BSA
Chosen is a post from CSS-Tricks
july 2011 by hanicker
Sprite Cow
june 2011 by hanicker
Making a really good CSS sprite image usually isn't trivial work. There are all kinds of tools to help with it. My favorite of them has been SpriteMe. I describe my typical workflow for using that here. Sprite Cow might be my new favorite though, can't wait to try it. With it, you design your own sprite (♥) and you use the sweet Sprite cow interface to get precise CSS background positions for the different parts of it.
Direct Link to Article — Permalink
Advertise here with BSA
Sprite Cow is a post from CSS-Tricks
Link
from google
Direct Link to Article — Permalink
Advertise here with BSA
Sprite Cow is a post from CSS-Tricks
june 2011 by hanicker
Google Map as a Background
march 2011 by hanicker
Cool idea and execution by Wade Hammess.
Direct Link to Article — Permalink
Link
from google
Direct Link to Article — Permalink
march 2011 by hanicker
CSS3 Finalize
november 2010 by hanicker
jQuery plugin from Han Lin Yap which allows you to write CSS3 without vendor prefixes. This plugin will read through your CSS files and in-document <style> blocks, find the CSS3 stuff, then append a new <style> block to your page with the appropriate vendor extensions for the browser you are in.
This solves one of the most common complaints about using CSS3, that is bloats your stylesheet with loads of repetitive properties.
Worked great in my limited testing. I gotta wonder about large sites with loads of CSS though. Is it fast enough to parse it all and get it applied to the page without first rendering the elements without CSS3? like FOUCSS3?
Direct Link to Article — Permalink
Link
from google
This solves one of the most common complaints about using CSS3, that is bloats your stylesheet with loads of repetitive properties.
Worked great in my limited testing. I gotta wonder about large sites with loads of CSS though. Is it fast enough to parse it all and get it applied to the page without first rendering the elements without CSS3? like FOUCSS3?
Direct Link to Article — Permalink
november 2010 by hanicker
Formalize CSS
october 2010 by hanicker
Framework by Nathan Smith for nice looking, HTML5 ready, progressively enhanced, cross-browser forms.
Direct Link to Article — Permalink
Link
from google
Direct Link to Article — Permalink
october 2010 by hanicker
Boilerplate CSS3 Media Queries
october 2010 by hanicker
A collection of media queries from Andy Clarke to get you started building responsive sites. Responsive is the new word for sites that react to the space they have available to restyle their content the best they can in that space.
Direct Link to Article — Permalink
Link
from google
Direct Link to Article — Permalink
october 2010 by hanicker
WebP Image Format
october 2010 by hanicker
Google has released a new image compression format called WebP (pronounced “weppy”). It is for photographic style images (like JPG) and also lossy (like JPG). Their example gallery has side by side comparisons where the WebP version is equal to in quality or better with smaller size. The download they offer though, has strangely different results… I’ve heard some murmors that the quality of WebP is worse, but also like JPG, there are quality settings so I’m not sure if that kind of blanket statement can be made.
Since no browser supports the format yet, you can use a “PNG wrapper” (file name is ___.png) so browsers will display them. You have to use a super nerdy Linux command-line tool to convert images. The converter takes JPGs as input, which is funny that this “better that JPGs” tool needs JPGs to work. Although I realize this is about small compressed images moreso than large high quality images.
I can’t see this format being used much at all until better tools are made to create images in this format.
Direct Link to Article — Permalink
Link
from google
Since no browser supports the format yet, you can use a “PNG wrapper” (file name is ___.png) so browsers will display them. You have to use a super nerdy Linux command-line tool to convert images. The converter takes JPGs as input, which is funny that this “better that JPGs” tool needs JPGs to work. Although I realize this is about small compressed images moreso than large high quality images.
I can’t see this format being used much at all until better tools are made to create images in this format.
Direct Link to Article — Permalink
october 2010 by hanicker
ProCSSor
september 2010 by hanicker
The prettiest of the CSS prettifiers. I find these things quite helpful when I’m inheriting someone else’s CSS and I want to get it into the format that I like the most without doing it by hand. Actually, I usually start doing it by hand and then go: Oh yeah! Computers!
This is the one I was using before, which is functionally great and I like the style in which it asks you what to do (e.g. After brace insert [new line?]).
Direct Link to Article — Permalink
Link
from google
This is the one I was using before, which is functionally great and I like the style in which it asks you what to do (e.g. After brace insert [new line?]).
Direct Link to Article — Permalink
september 2010 by hanicker
HTML5 Pack for Illustrator CS5
september 2010 by hanicker
Via Real World Illustrator:
You can designate certain attributes (i.e., fill, stroke, opacity) as variables right from the Appearance panel in Illustrator. When saved as SVG, developers can easily change the variable definition to “reskin” or modify the art
And other interesting stuff like:
You can select an object on the Illustrator artboard and then choose Object > HTML5 Canvas > Make. These elements are rasterized and included as canvas elements when saved as SVG, giving developers the ability to control the elements via JavaScript.
and:
You can select an object in Illustrator and export valid CSS directly from the Appearance panel.
Direct Link to Article — Permalink
Link
from google
You can designate certain attributes (i.e., fill, stroke, opacity) as variables right from the Appearance panel in Illustrator. When saved as SVG, developers can easily change the variable definition to “reskin” or modify the art
And other interesting stuff like:
You can select an object on the Illustrator artboard and then choose Object > HTML5 Canvas > Make. These elements are rasterized and included as canvas elements when saved as SVG, giving developers the ability to control the elements via JavaScript.
and:
You can select an object in Illustrator and export valid CSS directly from the Appearance panel.
Direct Link to Article — Permalink
september 2010 by hanicker
FireQuery
august 2010 by hanicker
This is a very cool extension for Firebug (add-on for an add-on?) that expands Firebug’s capabilities with jQuery. For instance, a built in jQueryify button, showing attached event handlers in the Content / DOM tree view, and highlighting all elements in a jQuery collection. I don’t think it’s new but I hadn’t seen it until I finally watched Remy Sharp’s debugging tools screencast from last month.
Direct Link to Article — Permalink
Link
from google
Direct Link to Article — Permalink
august 2010 by hanicker
Cross-Browser HTML5 Video and Audio
august 2010 by hanicker
MediaElement.js is a jQuery-based package for allowing us to:
Use the HTML5 elements <video> and <audio> and have them work cross-browser (including mobile WebKit)Deliver a consistent UI for controlsUsing only a single formatI’ll be using it in the redesign of this site. I was all prepared to just say I’m using HTML5 video and if your browser doesn’t support that then just download directly and use VLC or something. But then I realized I’d have to re-encode to at least include OGG and that really didn’t appeal to me with 90 videos. Plus then I was messing with trying to make the video fluid width and that wasn’t going well (another story) so I scrapped it. Now that we have this, it’s a done deal! Firefox/Opera/IE<8 will fall back to a Silverlight player and WebKit browsers (and ultimately IE 9) will use native HTML5.
One issue I’ve heard is that even when visiting a site using this with Chrome/Safari (natively supporting HTML5 with H.264), you can be prompted to install or update Silverlight, which kinda sucks. Apparently I have the lastest version installed so could not confirm this.
Direct Link to Article — Permalink
Link
from google
Use the HTML5 elements <video> and <audio> and have them work cross-browser (including mobile WebKit)Deliver a consistent UI for controlsUsing only a single formatI’ll be using it in the redesign of this site. I was all prepared to just say I’m using HTML5 video and if your browser doesn’t support that then just download directly and use VLC or something. But then I realized I’d have to re-encode to at least include OGG and that really didn’t appeal to me with 90 videos. Plus then I was messing with trying to make the video fluid width and that wasn’t going well (another story) so I scrapped it. Now that we have this, it’s a done deal! Firefox/Opera/IE<8 will fall back to a Silverlight player and WebKit browsers (and ultimately IE 9) will use native HTML5.
One issue I’ve heard is that even when visiting a site using this with Chrome/Safari (natively supporting HTML5 with H.264), you can be prompted to install or update Silverlight, which kinda sucks. Apparently I have the lastest version installed so could not confirm this.
Direct Link to Article — Permalink
august 2010 by hanicker