読者です 読者をやめる 読者になる 読者になる

IMUZA.com

Joomla!によるウェブ制作, PHP, Javascript, CSS

はてなブログ

はてなブログ テーマ制作
・とことこ with Menubar
・Simple Responsive with Menubar
・Mobile-First Responsive
・Hyperspace

Joomla!

Joomla! によるウェブ制作
・テンプレート自作
・モジュール自作
・Joomla!でサイト構築

Web Tips

ウェブサイトづくりに役立つかも
・Javascript
・CSS

Windows, Linux

Windows10
Plamo Linux

スクリプトなし :target でアニメーションをスタートさせる

はてなブログ Web Tips

スクリプトなしでアニメーションをスタートさせるトリガーに、:hover や :checked はよく使っています。

たとえば、公開中のはてなブログのテーマでは、:checked を使ってモバイルのハンバーガーメニューのトリガーにしています。

とことこ with Menubar - テーマ ストア

で、まだ公開していないテーマ「Hyperspace」でも、モバイル用に何らかのトリガーが必要なのですが、:checked ではうまくいきませんので、:target を使うことにしました。

こんな感じになります。