36歳でFIREしたデータサイエンティストが、資産形成に役立てた3つのチャートを共有してくれた

2024/05/01 226 users データサイエンティスト チャート 資産形成 Variable

上のチャートには、2024年の1月と2月の支出が記録されていて、このチャートをゴールドシュタイン氏は毎朝確認する。 まず、ゴールドシュタイン氏は支出を｢固定費（Fixed）｣と｢変動費（Variable）｣の2項目に大別する。その下に食費、家族、娯楽、罪悪感のある楽しみなどといったカテゴリーを設けている。 それぞれのカテ... 続きを読む

Chrome 108にはCSSの新しい機能がたくさん含まれている、新機能と変更・削除された機能のまとめ

2022/12/01 15 users CSS たくさん position 機能 まとめ

11/30（日本時間）にリリースされたChrome 108では、CSSの新しい機能がたくさん含まれています。また、変更・削除された機能もあります。特に、Android版のChromeでposition: fixed;を使用している要素の配置が期待通りにならない可能性があります。 Chrome 108の新機能、変更・削除された機能を紹介します。 chrome-108... 続きを読む

11月末のChrome 108でビューポートのサイズ変更動作が変更、position: fixed;は配置がずれる可能性があります

2022/11/15 100 users クロスブラウザ ビューポート position 挙動 配置

11月末にリリース予定のChrome 108で、ビューポートのサイズ変更動作が変更されます。簡単に言うと、Android版Chrome 108の挙動はiOS版Safariと同じになり、より一貫性のあるクロスブラウザの動作が実現されます。 サイズ変更動作の内容とサイズ変更の仕組み、Chrome 108のリリースまでに何を準備しておけばよいのかを紹... 続きを読む

CSSのcounters()で箇条書きの数字をカスタマイズできておもしろい - hogashi.*

2022/11/02 16 users hogashi 箇条書き Suffix CSS Symbols

CSS に counters() というのがあって、 1.1 とかをカスタマイズできておもしろい。 counters() - CSS: Cascading Style Sheets | MDN 言 葉 庭 というのをシンボルに使うことにして、繋ぎを の にするとこうなる。 @counter-style kotonohanoniwa { system: fixed; symbols: 言 葉 庭; suffix: " "; } ol { counte... 続きを読む

【コピペ可】background-attachment: fixed;がiOSのSafariで効かない問題を完全に解決する【CSSのみ】 | セカヤサブログ

2022/02/23 12 users iOS position 長方形 プロパティ Safari

こんにちは。今回はパララックス表現を行うためのプロパティ、background-attachment: fixedがiOSのSafariで動かない問題を回避するための方法を書いていきます。 結論（コピペ可）なぜ動かないのか実装・解説画像とテキストを配置する画像を全て固定（position: fixed）する長方形で切り抜くまとめ 結論（コピペ可） 最... 続きを読む

CSSで上下左右の中央に配置する時の「position: fixed;」での新しい記述方法 | コリス

2021/07/12 313 users モーダル コリス position パーセンテージ CSS

中央揃えの古典的なテクニックの一つ、モーダルやメッセージなどを表示する時に適したposition: fixed;での新しい記述方法を紹介します。 古い記述方法では、負のパーセンテージを使用していたり、あまり直感的ではない...記事の続きを読む 続きを読む

lernaでのmonorepoにおけるリリースフロー(Fixed/Independent) | Web Scratch

2019/01/26 41 users INDEPENDENT YARN Lerna ワークスペース

一つのリポジトリで複数のパッケージを管理する際にはLernaとYarnのワークスペースを組み合わせて運用するmonorepoにすることが多いです。 lerna/lerna: A tool for managing JavaScript projects with multiple packages. LernaにはFixed(すべてのパッケージが同じバージョン)とIndependent(パッケージごとに異なるバー... 続きを読む

Backlogのウォッチした課題のコメントをデスクトップ通知でお知らせするChrome拡張機能 - Qiita

2017/01/13 9 users Qiita Backlog webstore detail

BacklogWatch https://chrome.google.com/webstore/detail/backlog-watch/hgbfbnmhafkhigfegihpgapnmnmlfhgd 何するものなの 気になる課題を ウォッチ 1 するとコメントがついた時にChromeのデスクトップ通知を出してくれる良い感じの奴です。 ウォッチの方法は各課題のブラウザウィンドウ右下にfixedで... 続きを読む

iOS 9 の Safari でタブバーが表示されていると fixed な要素の計算上の位置がずれる - Qiita

2015/11/18 49 users タブバー メニューアイコン YouTube Qiita おまえ

何を言っているんだおまえは、と突っ込みたくなる方もいらっしゃるかと思いますが、ありのままに今起こったことを話すぜ…！ まずは動画をご覧ください。 （YouTubeに飛びます） 再現条件とか 以下の環境において端末を横位置にした上で画面をスクロールさせてタブバーを表示させると、{ position: fixed }で配置した要素が正常に機能しなくなります。 上記の動画ではメニューアイコンに張ったクリ... 続きを読む

Mozillaの報奨金制度で100万円ほど稼いだ話

2015/02/07 69 users Mozilla 報奨金制度 Transcript 1

Transcript 1. Mozillaの報奨金制度で 100万円ほど稼いだ話 SECCON CTF 2014全国大会カンファレンス 2015年2月7日@東京電機大学 Welcome to the Black Hole of Bug Bounty Program –RESOLVED FIXED- 2. にしむねあ Weekend Bug Hunter Lecturer of Security C... 続きを読む

レスポンシブWebデザインで必要な配置の仕組みがよく分かるアニメーションを使った解説 | コリス

2015/01/26 104 users コリス absolute static スタティック 配置

レスポンシブWebデザインを使用する際、Webデザインの配置がどのような仕組みになっているかを理解することは非常に重要です。PhotoshopやIllustratorなどのデザインツールに比べてそれは複雑で、スクロールやスクリーンサイズなどさまざまな要因に依存します。 さらに複雑しているのが配置の名称。 Static, Absolute, Relative, Fixed、、、スタティックとはどこが... 続きを読む

スクロール後、ナビゲーションをページトップに固定するjQueryプラグイン「stickUp」:phpspot開発日誌

2013/11/22 66 users position jQueryプラグイン ナビゲーション

スクロール後、ナビゲーションをページトップに固定するjQueryプラグイン「stickUp」 2013年11月22日- stickUp - a free jQuery Plugin スクロール後、ナビゲーションをページトップに固定するjQueryプラグイン「stickUp」 最初からposition:fixedではなく、一定以上スクロールした段階でfixedにしてくれるプラグインです。 シームレス... 続きを読む

gitのコミットの歴史を改変する(git rebase) 2 / 2 - けんごのお屋敷

2013/06/11 36 users Git squash コミット git rebase 何事

git rebase パート1の続きです。 fixed(コメントは変更せずにコミットをまとめる) fixed は squash と同じく1つ前のコミットとまとめる機能がありますが squash と違うのはコメントはそのままにするということです。 squash と同じ説明になりますが 70b3379 の メソッド名のタイポ修正 を何事もなかったかのようにしたい時は cce19c9 とまとめてしまいま... 続きを読む

垂直アイコンメニュー実装デモ＆サンプルプログラム「Vertical Icon Menu」:phpspot開発日誌

2013/03/11 25 users phpspot開発日誌 Codrops position

Vertical Icon Menu | Codrops 垂直アイコンメニュー実装デモ＆サンプルプログラム「Vertical Icon Menu」。 次のような左側にアイコンメニューがあって、position:fixedで固定されているだけなのですが、ダウンロードして使えるサンプルがカッコ良かったのでご紹介。 メニューにカーソルを合わせた時に、きちんとアイコン色と背景色がアニメーションしつつ変化す... 続きを読む

jQueryを使った一定以上スクロールすると上に固定される横メニュー｜Webpark

2013/03/04 244 users jQuery Webpark position 上部 一定以上

最近、上部に固定された横メニューをよく見かけます。最初から一番上にあるものだと最初から「position:fixed」で問題ないと思いますが、最初は一番上にはなく、メニューがページの最上部までスクロールされた時点で固定されるものだとちょっと工夫が必要です。 今回はそんな横メニューをできるだけ親切に解説してみます。 今回のメインはjQueryで固定するところなのですが、一応今回のサンプルで使用したH... 続きを読む

[CSS]ページに美しいシャドウを加え、奥行きを与えるスタイルシート -Depth | コリス

2013/02/19 213 users コリス Depth 奥行き position CSS

ブラウザ上枠のすぐ下、ページの上部に、いい感じのシャドウを加えるスタイルシートを紹介します。 Chrome, Safari, Firefox, Operaでご覧ください、IEは9+で。 Depth 実装は簡単で、HTMLは特に変更することなく、下記のスタイルシートを加えるだけです。 position: fixed;なので、スクロールしてもシャドウが表示されています。 [css] body:befo... 続きを読む

コンテンツ毎にサイドバーを固定配置できるjQueryプラグイン「Stick ’em」:phpspot開発日誌

2013/01/30 182 users STICK jQueryプラグイン phpspot開発日誌

jQuery Stick ’em: Make Content Sticky on Scroll, to a Point | Viget コンテンツ毎にサイドバーを固定配置できるjQueryプラグイン「Stick ’em」。 最近よくある、ページをスクロールしてもついてくるサイドバー。position:fixedなどを応用して綺麗についてくるようにできますが、コンテンツが大きく３つに分かれている場合... 続きを読む

gitのコミットログなんて"fixed"だけで十分だろ！エンジニアならコード読め！ - hogehoge @teramako

2012/11/21 92 users コミットログ hogehoge Git teramako

ソース: https://twitter.com/mattn_jp/status/271117577693044736 続きを読む

チャリ見つかりました！ご協力ありがとうございました！！ : FIXEDと物欲の記録

2012/11/07 9 users 経緯 駐輪場 アパート 放置 発見

チャリ見つかりました！！皆様ご協力いただき本当にありがとうございました。しばらく落ち込んでいたのですが、やっと元気になりました！本当にありがとうございます...チャリ見つかりました！！ 皆様ご協力いただき本当にありがとうございました。 しばらく落ち込んでいたのですが、やっと元気になりました！ 本当にありがとうございます。 では発見までの経緯を 6月1日、20時に自宅の二軒隣のアパートの駐輪場で放置... 続きを読む

スクロールしてもposition:fixedでウザくない感じのナビゲーション実装ライブラリ「stickyMojo」:phpspot開発日誌

2012/09/10 85 users position Jquery Plugin 感じ

スクロールしてもposition:fixedでウザくない感じのナビゲーション実装ライブラリ「stickyMojo」 2012年09月10日- stickyMojo contained fixed position sticky sidebar jquery plugin スクロールしてもposition:fixedでウザくない感じのナビゲーション実装ライブラリ「stickyMojo」。 一昔まえだ... 続きを読む

Stick your landings! position: sticky lands in WebKit - HTML5Rocks Updates

2012/08/30 28 users WebKit position

position: sticky is a new way to position elements and is conceptually similar to position: fixed. The difference is that a stickily positioned element behaves like position: relative within its paren... 続きを読む

スマホでの面白いトップナビゲーションの見せ方チュートリアル:phpspot開発日誌

2012/04/03 41 users phpspot開発日誌 スマホ position デモ 実機

Pull Down for Navigation - Inspect Element スマホでの面白いトップナビゲーションの見せ方チュートリアルがデモ付きで公開されています。 実際にデモを実機で試すのが一番よいかもしれません。position:fixed と z-index をうまく組み合わせて実現されています。 １つのテクニックとして認知しておくだけでも今後のアイデアに活用できるかも デモページ... 続きを読む

[CSS]サイズが分からない要素を真ん中に配置するテクニック | コリス

2011/11/01 493 users コリス mar CSS position Left

下記は各ポイントを意訳したものです。 要素のサイズが分かっている場合 要素のサイズが分からない場合 まとめと対応ブラウザ 要素のサイズが分かっている場合 「真ん中に配置するエレメント」と「その親エレメント」両方の高さと幅のサイズが分かっているのであれば、エレメントを真ん中に置くのは簡単です。 「真ん中に配置するエレメント」を「position: fixed;」にし、topとleftを50%、mar... 続きを読む

iOS5なのにposition:fixed;が効かない時に確認すること | Culture27

2011/10/28 44 users iOS position ゴー Culture27 下記

なんだかんだでFirefoxメインで制作しているわけですが、とあるページでposition:fixed;が効いてないみたいだよ？と@e_luckさんに教えてもらいまして、、、でちょっと調べてみて気づいたことです。 HTML5 Rocks - Improving the Performance of your HTML5 Appの「The magic CSS bullet」で紹介されていた下記のコー... 続きを読む

ウェブページに固定表示させるエレメントの効果的な使い方 | コリス

2011/09/09 291 users コリス エレメント ウェブページ ヘッダ 固定

「positon: fixed;」などで配置した、スクロールしても固定位置に表示されるエレメントの効果的な使い方を紹介します。 下記は各ポイントを意訳したものです。 はじめに ウェブページで固定表示されたエレメントは、最近多く見かけるようになりました。これはページで表示されていない箇所へスクロールした時に、特定のエレメントのみ表示を残すものです。最もよく見かけるのは、ナビゲーションを含めたヘッダで... 続きを読む