Behavioral CSS article

December 29th, 2009

Here is a link to a Smashing Magazine article about Behavioral CSS. This is all CSS3 stuff, and while cool, most of this stuff is totally unusable in the real world. Javascript can do this stuff better, and will actually be supported in most browsers. These CSS3 tricks are supported by webkit, but IE, any version, tells them to go directly to jail. No money for you.

Still, a cool read to see how stuff can be done.

Good article on jquery animate()….

December 15th, 2009

Nice little article: Fully Executing jQuery Animations Without Queuing

If you haven’t checked out Chris Coyier’s site CSS Tricks….I highly recommend it. Really good stuff there.

How to make a gradient mask in flash

December 3rd, 2009

I helped one of my fellow co-workers by figuring this out. Was not easy, and wasn’t fun, but once I got it…all was good and I was happy. So here is the the quick instructions on how to do it. Enjoy!

3 layers:

Bottom layer
: stuff you want masked – make it movie clip with an instance name of: maskee
Middle layer: the actual mask – make it a movie clip with an instance name of: mask_mc
Top layer: action script layer

place this in the first frame of the mask middle layer:
maskee.setMask(“mask_mc”);

place this in the actions layer:
maskee.cacheAsBitmap = true;
maskMC.cacheAsBitmap = true;

Click on each movie clip, and in the properties panel, and check: Use runtime bit Caching. (Can’t remember if this was really needed or not).

And there you go!

Article about what is bad about SmashingMagazine.com

December 3rd, 2009

Here is a link to an article that the guy over at Drawar wrote about the state of the design community with some punches thrown at smashingmagazine.com.

I like this piece of writing. I think he has a bit of a chip on his shoulder, or at least it comes off that way to me, but his points are valid. It mainly deals with how one site, smashingmagazine.com has spawned a ton of copycat sites, to the point where you stop caring about any of them.

One of his “things” is the list type articles that they do. There is no real discussion on design as a whole. The community has pretty much become “Where are the 50 images of sites? You must suck if your article doesn’t show at least 30 things”. I would agree. In fact if you look at smash’s site now, you can find tons of list articles like 50 free buttons or 50 wordpress themes. Those would be fine, if like this author says, the people writing those articles wrote why each of those 30 things are there…why they are great, or why they suck.

Personally I like articles that show a problem in web design, and then tell you how to fix the damn thing. Which is what I try to do here even though all I seem to get is a lot of freakin’ spam. Its also hard to find the time to write something that you hope people will find some use of. I try though.

Anyway, if you are reading this, check out the article….its a good read.

Rotate text or images using CSS

October 29th, 2009

Here is a bit of css with sample html to show you how to rotate text or an image using css. Works in FF 3.5, Chrome, Safari (most likely just 4, but have not tested in others), IE6-8 (read it supports 5.5). I got this from http://snook.ca.

CSS:

#book {
display: block;
float: left;
}
.title {
display: block;
-webkit-transform: rotate(-90deg); 
-moz-transform: rotate(-90deg);
filter: progid:DXImageTransform.Microsoft.
BasicImage(rotation="3");
position: absolute;
}
</style>

HTML:

<div id="book">
<span class="title">War of the Flowers</span>
</div>

Each browser needs its own little prefix for this (the filter is for IE).

Although I can’t think of a reason off the top of my head why I would use this, its still a neat little trick.