CSS3でアニメーション【vol.5】- ちょっと複雑なアニメーションを作ってみる。 | Stronghold Archive
どうもこんにちは。Toshikuraです。今回のtipsは【CSS3でアニメーション【vol.5】- ちょっと複雑なアニメーションを作ってみる。】です。全5回に分けてステップアップ式に記事化している最終回です。これまでの全4回の記事を統合してすこ複雑なアニメーションを作ってみます。 【vol.1】- とりあえずはじめの一歩。 【vol.2】- ホバーでアニメーション実行 & 複数アニメーションの組み合わせ方法 【vol.3】- イージングを生成してくれる便利なジェネレーター 【vol.4】- クリックでアニメーションを実行させる方法（複数同時実行例含む） 【vol.5】- ちょっと複雑なアニメーションを作ってみる。 【vol.6】- CSS3アニメーションで動作するjQueryスライダーを作ってみる 【vol.7】- jQueryでCSS3アニメーションの終了のタイミングを取得する方法 ア
css3のanimationで作る永久ループのスライドショー | パソコン倶楽部りんご
「Pure CSS3 Cycle Slider」をお手本にして、css3のanimationで永久ループするスライドショーを作ります。 とても美しい動作ですので、まずは動作を確認して下さい。 画像にマウスホーバーすると、スライドが止まる マウスホーバーで画像に対応するh1が現れる スライドの表示秒数を伝える工夫もされている マークアップをキチンと考える 最終的にCSSで動作させるのか、jQueryで動作させるのかに関わらず、まずはきちんとマークアップします。そうすると以下の利点があります。 スライドの中身が、クリックさせたいリンクの列挙だとすれば、SEOの効果も望めます。単に画像を動かすのと、見出しタグ付きの要素が動いているのとでは大違いです。 対象ブラウザに合わせて、実装方法を選択できます。例えば、古いIEなどでも動かしたければ、古いIEにだけIEの条件コメントで自作のjQueryを読み
アイディアに価値はない
よく、鼻息荒く、「これ絶対に秘密ですよ！」と新しいサービスやプロダクトのアイディアを話す人がいます。けど、アイディアに価値はないんですよね。価値ゼロ。 例えば海外の凄いサービスのアイディアだけ見て、「こんなのを作ってよ」と外注しても、凄いものが生まれるなんてことは、ほぼありません。 ちょっと前に、Linkedinに買収されたCardMunchというサービスのCEOと会ったときに、彼も言っててハラオチしました。「名刺管理なんてアイディアは掃いて捨てるほどあるけど、本当に重要なのは、Executionだ」と。 アイディアに価値はなくて、それをどうやって実現するかで、最終的にそのプロダクトを使う側の印象は全く違うことになってくるんです。同じ「名刺管理アプリ」でも、天と地ほどの差がある。 だから、「つくれる」ことに価値があるんだと思います。 今後のエンジニアの定義というのが、UX（ユーザの体験）も
クリッカブルマップもレスポンシブにするjQueryプラグイン「Responsive Image Maps」:phpspot開発日誌
クリッカブルマップもレスポンシブにするjQueryプラグイン「Responsive Image Maps」 2014年03月20日- esponsive Image Maps jQuery Plugin クリッカブルマップもレスポンシブにするjQueryプラグイン「Responsive Image Maps」 クリッカブルマップ、といえばHTML入門時には面白そうと思ったわりに設定が面倒なのであまり使わなくなったという方もいるかもしれませんが、あのクリッカブルマップをレスポンシブにするjQueryプラグインだそうです。 リサイズ時にクリッカブルマップのデータを再計算してマッピングしてくれるようです。 タッチ型デバイスでは意外と使えそうなこの機能。 この際に再度利用法を検討してみるのもよいかも。 関連エントリ レスポンシブで何でも埋め込めるLightBox実装jQueryプラグイン「Veno
初心者でも絶対わかる、WebGLプログラミング＜three.js最初の一歩＞
初心者でも絶対わかる、WebGLプログラミング＜three.js最初の一歩＞ 小山田 晃浩（株式会社 ピクセルグリッド） WebGLはとても高度な技術である一方、APIは低レベルであるためそのまま使うにはどうしても冗長な準備を行う必要があります。一方で、JavaScriptライブラリーを通して高レベルなAPIとしてWebGLを利用する方法があります。こうしたJavaScriptライブラリーとしてはthree.js、Away3D.js、Babylon.jsなどが有名です。その中でも特に人気があるthree.jsを通して、WebGLを利用する方法を解説します。(three.jsのリビジョンは執筆現在の最新であるr65を利用します) three.jsを手に入れる three.jsはhttp://threejs.org/から手に入れることができます。downloadから、zipファイルを手に入れま
[WordPress]カスタムタクソノミーに親子関係（階層）を持たせ、複数選択したタームの並び順を親＞子の順番に表示する | tipsBear
[WordPress]カスタムタクソノミーに親子関係（階層）を持たせ、複数選択したタームの並び順を親＞子の順番に表示する WordPressのカスタム分類（タクソノミー）にはhierarchicalという、カテゴリーのような親子関係（階層）を持たせる第3パラメータがあります。 今回は、上記の設定で親子関係をもたせたカスタム分類（タクソノミー）のタームを、親＞子のように親子で並べる方法のメモです。 ※「カスタム分類（タクソノミー）」だと長いので、以下省略して「タクソノミー」と記述します。 やりたいこと タクソノミーに階層をもたせ、タームに親子関係をもたせたい 投稿記事に属している上記のタクソノミーのタームたちを、親＞子の順番できちんと並べたい。 タームが複数選択されていた場合も、親＞子・親＞子のように順番に並べるようにしたい。 上記に書いてあることそのまんまでひねりなし。文章だけ見ればすごく
![[WordPress]カスタムタクソノミーに親子関係（階層）を持たせ、複数選択したタームの並び順を親＞子の順番に表示する | tipsBear](https://cdn-ak-scissors.b.st-hatena.com/image/square/8a2b256f3d3835e535fef866f2e9a784966add71/height=288;version=1;width=512/https%3A%2F%2Ftipsbear.com%2Fwp-content%2Fuploads%2F008.png)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「CSS Nite 9年目に見る勉強会の今とこれから」鷹野 雅弘（スイッチ）