CSS Transitionを使ったスムーズにスクロールしてトップに戻る機能
前に作ったスクロールした時に位置固定のロゴをトップに戻る機能にすり替えるものを少し手直しして再導入した。今回はスムーズにスクロールさせようかと色々考えていたが、やはりJavaScriptでscrollTo()を制御するのはコストが高い。CSSならどうだと試行錯誤したところ、どうやらbody要素への負のマージンをCSS Transitionで滑らかに変化させれば良いようだ。 Demo: Scroll Smoothly with CSS Transition デモのページにはダミーテキストの各セクションの最後にそれぞれ⇑ Back to Topというリンクがある。それをクリックすると1秒かけてスムーズにスクロールしながらトップに戻る。トリガーとスクロール自体はJavaScriptで行っているが、スクロールのアニメーション自体はCSS Transitionで行っている。具体的には以下のような処理
ASP.NETに採用されたBootstrapでCSSデザイン変更
<!-- フォーム部分 --> <form class="form-horizontal" role="form" action="/Account/Register" method="post" novalidate="novalidate"> <input name="__RequestVerificationToken" type="hidden" value="prXfel..."> <h4>新しいアカウントを作成します。</h4> <hr> <div class="validation-summary-valid" data-valmsg-summary="true"> <ul> <li style="display: none;"></li> </ul> </div> <!-- (1)ユーザー名 --> <div class="form-group"> <label class
Twitter Bootstrap向けのUIキットを複数配布する・PixelKit-Bootstrap-UI-Kits
Twitter Bootstrap向けのUIキットを配布するプロジェクトが素敵だったので備忘録。何種類か用意されており、どれもクオリティの高いものとなっています。 Bootstrap向けのUIキット集です。 Bootstrap用のUIキットです。デザインも複数用意されています。こちらはフラットなデザインのタイプ。 ↑ ちょっと優しい色合いで可愛いです。 ↑ ポップなデザイン。 ↑ スタイリッシュなもの。 ↑ ナチュラルなテイスト。個人的に一番好きです。 ↑ メトロなスタイルなどなど。 こんな感じで現在7種ほど、Githubにて配布されています。参考になりそうですね。 PixelKit-Bootstrap-UI-Kits
Web制作時に地味に役立ちそうな様々なツールを一纏めにしてOSS化したツールセット・Effin Toolset
JavaScriptのコード整形や難読化、 リソースのリンク集などなど、Web 制作に地味に役立ちそうなツール を一纏めにしてOSSとして無償配布 しているツール郡、Effin Toolset のご紹介です。役に立つかどうか は個人差もあるでしょうけど・・ データスキームURI変換ツールやJSコードの整形、難読化ツールなどなど様々なツールが一纏めにされてGithubで無償公開されています。 便利そうなものからネタ的なものまでツールいろいろ。 dataurl ↑ 画像をドラッグ&ドロップしてdataスキームURIに変換するやつ Escaper ↑ CSSのcontentプロパティで特殊文字等を使う際にUnicode エスケープシーケンス形式に変換するツール jjencoder ↑ 難読化ツール などなど他にもいろいろ（ネタツール的なものも含めて）あり、githubで一括DLできるようになって
俺の基地
俺の基地 単に自分の経験をドンドンまとめていくサイトです。 雑多なメモ集 経験が参考になれば幸いです。インターネットへの少しの恩返し なのでカンチガイ内容や、古い内容、間違い、妄想などを含んでる可能性が高いので、まちがってたらはてブとかなんでもご意見ページでもいいので教えてください ページ内容を移動、分割、名前の変更等を結構やりますので検索ページから来たけど内容が見つからない〜って人は一覧から探ってみてください ▲ ▼
www.vacant-eyes.jp – このドメインはお名前.comで取得されています。
このドメインは お名前.com から取得されました。 お名前.com は GMOインターネットグループ(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日本のドメイン登録業者(レジストラ)（「ICANNがレジストラとして認定した企業」一覧（InterNIC提供）内に「Japan」の記載があるもの）を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2023年10月時点の調査。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
フロントエンド開発の為のコンポーネント集・「FORMSTONE」
ASP.NETに採用されたBootstrapのグリッドシステム＆ナビゲーション