昨日の日記の舌の根も乾かぬうちに。
Chrome は CSS だけではドット絵を綺麗に拡大できないけど、Javascript 使えば出来るよ。
でも、面倒くさいからそこまでやらないよ。と昨日書いた。
しかし、僕が Chrome 使いなので、「できない」というのはどうにも悔しい。
そこで、やらないと言っていたのに Javascript で実現してみた。
方法は、昨日仕上げたドット拡大方法に追記してある。
誰でもコピペして使ってもらえるように、出来るだけ短いコードにするようにした。
…短くした都合もあって、動作は最適ではない。
というのも、ユーザーエージェントだけ見て Chrome と判断しているので、エージェント偽装があると間違えるかもしれないし、ページを全て読み終わってから動作するので動作が遅い、など多少の問題がある。
Javascript を使っている、といっても、１ドットづつドットを見て拡大している…というわけではない。
単に、Javascript の「拡大コピー」機能を使っているだけ。
javascript で拡大コピーすると、普通は HTML で画像を拡大するのと同じことになる。
なのだけど、なぜか Chrome では HTML +CSS では「スムージングしない」設定ができず、Javascript では出来る。
だから、読み込み終わったすべての画像に対して、拡大したいサイズの Canvas を用意して拡大しているだけ。
＃翌日追記
昨日日記を書いた時点では、Chrome で CSS が使えないのを「なぜか」だと思っていた。
でも、いろいろ調べると、使えないことこそが妥当で、それを javascript でカバーできるのも妥当のようだ。
CSS 草案には方法が書かれておらず、javascript 草案には方法が明記されている、という事実があるため。
いずれも草案なので、今後状況が変わることはあるかもしれない。
同じテーマの日記(最近の一覧)
別年同日の日記
申し訳ありませんが、現在意見投稿をできない状態にしています。 |