[B! スクロール] tact_tomiのブックマーク

tact_tomi id:tact_tomi

スクロールに関するtact_tomiのブックマーク (3)

JavaScriptだけで実装する、ページ内リンクのスムーズスクロール（はてなブログ仕様） - わたしと納豆ごはん
前回、jQuery で脚注もスクロールで移動するようにするスクリプトを紹介したのですが、この動作だけで jQuery を使うのはちょっと…、などと思うことがあるかもしれません。わたしもどちらかと言えばそんな方です。なので、いろいろ調べてみてJavaScriptだけで作ってみました。まあ、ページ内リンクのスムーズスクロールとなると、jQuery のほうが断然簡単に書けて楽なのですけどね（笑）でもまあ、何事もチャレンジ。なので、作ってみたスクリプトを紹介したいと思います。 JavaScriptだけで「はてなブログ」の脚注にも対応した、ページ内リンクのスクロール移動最近では JavaScript も jQuery のように書けるものが増え、以前に比べたら非常にシンプルに書けるようになりましたね。ちょっとだけ長いですが、書いたコードはこちらです。あ、ちなみに対応ブラウザは日本でメジャーなブ
tact_tomi 2018/05/14
jQuery無しでの書き方。後、jQuer という略し方が気になった。検索避けかと思いきや、下では全部書いてるのでなんじゃろ

JavaScript

スクロール

実装例
リンク
[JS]ページのデザインに影響を与えないパーフェクトなスクロールバーの超軽量スクリプト -Perfect Scrollbar
Perfect Scrollbar Perfect Scrollbar -GitHub 何をもってパーフェクトなのか Perfect Scrollbarのデモ Perfect Scrollbarの使い方何をもってパーフェクトなのかこのスクロールバーにパーフェクトとつけた理由は、下記の4つだそうです。ページ上のあらゆる要素にCSSで影響を与えないことスクロールバーがオリジナルのデザインに影響を与えないことスクロールバーのデザインは完全にカスタマイズ可能であることコンテンツの大きさが変化したら、スクロールバーの大きさと位置がそれに合わせて変化すること Perfect Scrollbarのデモデモではあずにゃんの画像をホバーすると、スクロールバーが表示されます。デモ：領域を拡大バーの長さが変化していることに注目してください！ Perfect Scrollbarの使い方 Step
tact_tomi 2013/01/30
jQuery

Web制作

スクロール

*あとで
リンク
Persistent Headers | CSS-Tricks
UGURUS offers elite coaching and mentorship for agency owners looking to grow. Start with the free Agency Accelerator today. This is some code to get the header of some content area to stay visible at the top of the screen as you scroll through that content. Then go away when you’ve scrolled past that relevant section. Header… persisting. Couple things to know before we get started: There are many
tact_tomi 2011/08/17
スクロールに対応して指定要素が特定距離を追従する。「スクロール位置」と「指定要素の位置＆幅」を比較してcssのvisibilityを操作する条件分岐。スクロール系の処理を作成する時の参考にメモ

jQuery

スクロール
リンク
1