December 2009
November 2009
September 2009
December 2008
July 2008
something new
117.milov.nl - a bit of fun with border-style: dashed;.
Exact rendering depends on browser model and window size. Warning: hypnotizing!
May 2008
April 2008
March 2008
February 2008
October 2007
April 2007
February 2007
December 2006
November 2006
October 2006
June 2006
May 2006
December 2005
November 2005
October 2005
Flickr view big bookmarklet
I wrote this little bookmarklet to help me instantly grab the large/original version of any Flickr photo. Funnily enough, because of Flickr's consistent filenaming scheme, it also works for photos where the See different sizes
option normally remains hidden:
view big (gets 1024px version; should work for most photos)
){s=M[m].src; if(s && s.match(/static/) && !s.match(/_s|buddy/)){void(window.open(s.replace('.jpg','_b.jpg'),'_self')); break}}){kind=link}
view original (gets full version as uploaded; works for photos pre-March 2007)
){s=M[m].src; if(s && s.match(/static/) && !s.match(/_s|buddy/)){void(window.open(s.replace('.jpg','_o.jpg'),'_self')); break}}){kind=link}
Drag the link above to your Bookmarks Toolbar (or right click, Add to Favorites), then click it when viewing a single Flickr photo page.
Here's the formatted source code, if you're into that sorta thing:
for (m in M=document.getElementsByTagName('img'))
{
s = M[m].src;
if (s && s.match(/static/) && !s.match(/_s|buddy/))
{
void(window.open(s.replace('.jpg','_o.jpg'),'_self'));
break;
}
}
September 2005
July 2005
June 2005
New bookmarklet: counters
(drag to Links-bar or right-click to Add to Favorites)
Tested in IE6 and Firefox. For every mouseclick, a small [1], [2], [3] incrementing counter will appear. Handy if you want to easily count the number of times something occurs on a page, such as the number of films you've seen of a specific IMDb actor/director (which prompted this idea in my case).
photographic favicons
Tee hee, each photo entry on this site now gets as a unique favicon a 16x16 version of the photo itself. Looks kinda neat when you open a bunch of them in tabs (try it out by middle-clicking some of the id numbers of the entries below).
I love it when ideas go from thought to successful implementation in less than 10 minutes.
Update: adding a photo to this entry so you can see it in action right here...
new feeds view
milov.nl/feeds/
I'm having a lot of fun styling my new simple and lean blo.gs-powered feeds view. Check it out in a browser that supports modern CSS (i.e. not IE) and observe li:hover, ::after and content: attr(href) in action...
Update:
Well, it seems blo.gs is offline for a bit after being sold to some unknown party, so the feeds view might not get updated for quite some time. Anybody know any other good centralized weblog update trackers? I tried BlogRolling for a while but it only seemed to indicate one new updated weblog per day.
Update 2:
blo.gs is back, yay! Turns out it's been acquired by Yahoo!.
May 2005
April 2005
March 2005
February 2005
January 2005
How to display <ul> elements as a flat comma-separated list (now in effect in the main menu and links list in the left-hand column):
ul.links { list-style: none; margin: 0; padding: 0; }
ul.links li { display: inline; }
ul.links li:after { content: ","; }
ul.links li:last-child:after { content: ""; }The advantage of this is that changing the default separator from a comma to | or - or whatever now means only having to change one character in the stylesheet.
Note: Internet Explorer doesn't support the css content attribute or :after and :last-child pseudo-classes, so the commas won't appear in IE.
December 2004
November 2004
(unfinished) code dump
- sparks
- Drag a pattern with left mouse button to make "sparks" appear. Animation is created by cropping, moving and fading one single .gif circle.
- sen9 aka three-letter-poet
- Mouse movements generate random three-letter-strings. When it hits an actual existing english three-letter-word, the word is added to the main sentence (click to start a new sentence).
- sticky drag blocks
- Drag-and-drop collision-detection experiment.
- bgrotate
- Multiple layers of a simple pattern rotating at different speeds (runs a lot faster in IE than in Firefox).
- slanty
- slanty2
- Trying to do something interesting with css border slants. Update: broken in IE at the moment.
- zllm
- zllm2
- Attempts at a shrinking zoom-effect by applying smaller and smaller relative (%) sizes...
The PHP WTF
October 2004
Negative(!) text-indent is in effect in the quicklinks list (over there on the left of the front page). Handy... applying a style like padding-left: 10px; text-indent: -10px; to an element makes all lines of that element appear indented except the first one.
September 2004
August 2004
July 2004
fixed width font in Gmail
Does Gmail have a setting somewhere to make message text appear in a fixed width font? 'Cause if it does, I sure can't find it...
To force it to use a fixed width font anyway, I added the following to userContent.css in my Firefox profile:
div.msg div.mb {
font-family: monospace !important;
font-size: 12px !important;
}
(Firefox's 'View Selection Source' came in real handy trying to figure out these classnames; regular View Source is a pain on Gmail because the whole thing's Javascript-generated.)
June 2004
May 2004
using :visited and expression() to detect any visited link
There's been some talk (see Anne, CollyLogic) about it being possible to use the :visited pseudo-class and background-image urls to detect if a user has visited a particular link.
Luckily for Internet Explorer users, they are unaffected because IE doesn't support the [href=] selector. Unfortunately, there's another method that does work in IE and is even more dangerous...
March 2004
POVRay Short Code Contest - scene files of 256 bytes or less for the POVRay raytracer. [via Metafilter]
January 2004
A checklist of i.am/bald numbers I really should update since they don't work or no longer work in Mozilla Firebird (my default browser for over a year now):
10, 14, 20, 23, 25, 26, 28, 30, 31, 33, 34, 35, 36, 37, 39, 40, 42, 44, 45, 46, 49, 50, 51, 55, 56, 57, 62, 65, 66, 67, 69, 71, 72, 73, 74, 77, 79, 90, 92, 94, 95, 96, 97, 98, 99, 102, 108, 109, 112, 113.
integrating javascript into stylesheets
Ben Nolan's non-link element hovering trick for Internet Explorer (that normally only allows :hover styles on links) is pretty handy, but what really impressed me about it is his way of integrating arbitrary Javascript functions into the stylesheet itself:
body {
background: url("
javascript:
document.body.onload = function(){
...custom js here...
}
");
}By specifying a rule like this in the browser's user stylesheet, it might even be possible to run a custom set of Javascript commands on opening of any visited website. (Although my brief attempt at making this work proved unsuccessful.) [via webgraphics]