a:activeで画像を拡大

CSS

以前zoomを使って拡大してみたけれど、a:activeでも拡大が出来るではないか。
activeになった時の幅を指定すれば、画像をクリックした時にそのサイズになる。
a:hover、a:focusでもやってみたが、こちらは無反応だった（IE6だけ？）





active前から画像のpositionをabsoluteにすると、後に続く記述がずれないで済む様子。
他をactiveにすると元のサイズに戻る。
こんな感じ↓

<style type=text/css>
    a.test img {
        position: absolute;
        width: 30px;
    }
    a.test:active img {
        left: 150px;
        width: 500px;
    }
</style>
<body>
    <a href="#aaa" class="test"><img src="test.jpg"></a>
    <!--改行を入れない方がいい-->
</body>

※4月6日↑書き直した。