CSS selectors for AS3
Posted on Monday, August 18th, 2008 at 10:19 am
Traversing the display list in AS3 is so tedious. I wish I could use jQuery/CSS/XSLT style selectors:
jQuery has spoiled me with easy DOM traversal. Instead, we have to do this:
Edit: It looks like someone has ported the $-style traversing to AS3. Finally!
$('stage movie button').addChild(child);jQuery has spoiled me with easy DOM traversal. Instead, we have to do this:
stage.getChildAt(3).getChildAt(12).addChild(child);Edit: It looks like someone has ported the $-style traversing to AS3. Finally!
How Dylan avoids widows
Posted on Tuesday, July 22nd, 2008 at 12:05 am
Typographical widows, that is. Learning jQuery (an excellent blog, even for the power users) had a wonderful post on how to use jQuery to append widows.
(If you didn't take a print class in high school, a widow is a word that ends on the next line like
this.
This is a print master's nightmare and a typographical no-no.)
Their solution uses regular expressions, which is nice, but not the most efficient way to split strings, and a bit of a memory hog on older systems.
Why not use CSS property
This snippit of jQuery wraps the last two words of every H2 tag with a span tag that has an inline style that prevents line-breaks. The result? No more widows without the performance hit of Regex.
(If you didn't take a print class in high school, a widow is a word that ends on the next line like
this.
This is a print master's nightmare and a typographical no-no.)
Their solution uses regular expressions, which is nice, but not the most efficient way to split strings, and a bit of a memory hog on older systems.
Why not use CSS property
white-space: nowrap;?
$('h2').each(function() {
var h2Contents = $(this).html().split(" ");
h2Contents[h2Contents.length-2] = '<span style="white-space: nowrap; color: red;">' + h2Contents[h2Contents.length-2];
h2Contents[h2Contents.length-1] = h2Contents[h2Contents.length-1] + '</span>';
$(this).html(h2Contents.join(' '));
});
This snippit of jQuery wraps the last two words of every H2 tag with a span tag that has an inline style that prevents line-breaks. The result? No more widows without the performance hit of Regex.
Pure CSS LightBox, no javascript
Posted on Thursday, February 21st, 2008 at 10:07 am
Current Javascript solutions for LightBoxes are kind of cumbersome, bloated, and CPU-intense.
Unsatisfied with the current state of LightBoxing, I developed a pure, organic, CSS-powered LightBox. Absolutely zero javascript. All of this under 1kb.
Click here to preview the CSS LightBox
The core of Multi-state CSS is the
Unsatisfied with the current state of LightBoxing, I developed a pure, organic, CSS-powered LightBox. Absolutely zero javascript. All of this under 1kb.
Click here to preview the CSS LightBox
The core of Multi-state CSS is the
:target pseudo class. When a user clicks a page-anchor the :target pseudo class is activated, revealing the lightbox element. Here's the code:
div.lb {
display: none;
}
div.lb:target {
display: block !important;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
text-align: center;
background: url('screen.png');
position: fixed;
padding: 2em;
}
Why I hate MySpace
Posted on Sunday, December 9th, 2007 at 4:30 pm
Making your own CSS styles is a nice (albiet butchered and terrible implemented) touch in MySpace.
In a normal web design workflow, you have something like this:
In a normal web design workflow, you have something like this:
.modules {
background-color: #fff;
padding: 15px;
}
.modules p {
color: #aaa;
line-height: 150%;
}In MySpace’s world, it’s more like this:
table table table table td, table table table table tbody td {
background-color: transparent !important;
padding: 15px !important;
}
table table table table td font, table table table table tbody td font {
color: aaaaaa !important;
line-height: 150% !important;
}
Ugh. Stab me in the eyes as hard and fast as you can, MySpace.Search
Tag Cloud
ajax as3 businesscard captcha chumby css design fap fapi flash hack hotlinking interface javascript jquery json lightbox myspace pipes site translation typography usability webservice wigits xss yahoo