jQueryとCSSのtransitionで可視範囲に入ってからアニメーションさせる方法
可視範囲になってから表示されたり動いたり、スクロールに応じてアニメーションさせる方法を紹介します。動きをつけて目を引くことで、効果的に伝えることができるかもしれません。 以前、「jQueryを使って、スクロールしてコンテンツが現れたときにアニメーションさせてみる｜Webpark」という記事で同じようなものを紹介したのですが、デモが気に入っていない、アニメーションが1度きりということで作り変えました。 まずはサンプルをご覧ください。スクロールするとアイコンとテキストが順番にフェードインします。 このサンプルで使われている、画面いっぱいに表示する方法と、上にスクロールしたときに現れるメニューは以前紹介しています。気になる方はどうぞ。 画面サイズに合わせて高さを指定する3つの方法｜Webpark jQueryで作る、下にスクロールで消えて、上にスクロールで現れる固定メニュー｜Webpark とい
CSSの@supportsを使ってCSSのみでスタイルの条件分岐をする方法
2015年10月27日 CSS Webブラウザーによって表示可能なCSSが異なるのは、よく知られていることです。例えばChromeやSafariでは問題なく表示される filter は、Internet Explorerではうまく表示されず、別のスタイルを用意しなければいけません。今回は @supports を使って対応しているプロパティー別にスタイルを変更してみましょう。 ↑私が10年以上利用している会計ソフト！ @supports とは？ 指定した (プロパティー:値) の条件に対応しているブラウザーには {} 内に書かれたスタイルを適用するよ、というもの。新しいスタイルの書き方に対応しているブラウザーにはそれを、対応していないブラウザーには従来の書き方で、かつ見栄えの崩れないようにコンテンツを提供できるよう、CSSを記述していけます。「プログレッシブエンハンスメント」というやつですね
より良いプログラムを書くための究極の奇策 – 「Data first, not code first」 | POSTD
(訳注：2015/10/31、いただいた翻訳フィードバックを元に記事を修正いたしました。) 開発者は嫌うでしょう。 ここでは、標準的なコツや策略について書きますが、本当に興味があるのは、別のことです。究極の奇策を見つけたいと思います。策略をひとつずつ試して、プログラミングの聖域に少しでも近づければ良いのですが。 はじめに 私が初めて書いたビデオゲームは、 Ninja Wars （忍者戦争）でした。 そう、これは、画像で埋めたHTMLのtableです。 src 属性を変えることで、動きを実現しています。JavaScriptファイルの冒頭は下記のようになっています。 var x = 314; var y = 8; var prevy= 1; var prevx= 1; var prevsw= 0; var row= 304; var endrow= 142; var sword= 296; v
定時後の「帰りにくい空気」とどう向き合うか | サイボウズ式
マネジメント 新しいチームのあり方を探求 就活 就活生必見！サイボウズの疑問 ティール組織 会社の「あたりまえ」が変わる 多様性 100人100通りの個性 ワークスタイル 働き方、生き方、もっと自由に 青野慶久 サイボウズ社長の想いと覚悟 キャリア 人生の「積み上げ方」を見直す 複業 複数の「本業」をもつ働き方 人事制度 多様な働き方を支える仕組み マンガ サクッと手軽に読める！ 【サイボウズ式編集部より】「ブロガーズ・コラム」は、サイボウズの外部から招いた著名ブロガーによるチームワークコラムです。今回は日野瑛太郎さんによる「定時後の“帰りにくい空気”との向き合い方」について。 2015年10月12日の朝日新聞朝刊に、「残業漬け 私はごめんだ」という見出しの特集記事が載りました。実はこの記事に、長時間残業を否定する立場のコメントとして僕のコメントが載っています。掲載されるという連絡は事前に
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
