青いやつの進捗日記。

メモとしてべんきょうのしんちょくをかいていきます。あとで自分が検索しやすいもん

2020-04-01から1ヶ月間の記事一覧

scrollToのbehaviorのPolyfill別のもあった

iamdustan/smoothscroll これのsrcの中身をダウンロードして置くか、 今どきのスムーズスクロール(2019年版) Webpack使えてimportで済むならscroll-behavior-polyfillで良い感じがする が、Webpack使えないのであれば、smoothscrollのsrcの中身のsmoothscrol…

addListenerでmatchmediaの切り替えでイベント発生

matchMediaを使うとCSSとほぼ同じような書き味でメディアクエリを書けます。 が、CSSのようにデバイス幅をいつでも取得してるわけじゃない(そう書けばそう書けますが)ので、PCSPの切替時にイベントを起こせません。 と思ったら、matchmediaでaddListerを使…

GatsbyでProps渡してPCSP表示非表示切り替えする

SizedImageというComponentでspOnlyというPropsにtrueを渡す <SizedImage spOnly={true} filename={'about/history/img-logo.png'}></Image> SizedImageのComponentを定義 export default class SizedImage extends React.Component { render() { return( <Container spOnly={this.props.spOnly}> <Image filename={this.props.filename}><…</image></container>

BitbucketよりGithubのほうが良い理由

メモ。 最近GithubのTeamの有料アカウントが9ドルから4ドルに値下げされましたね。 jp.techcrunch.com とはいえBitbucketは3ドルなので、まだBitbucketのほうが安い。 www.atlassian.com じゃあどんなところがGithubのほうが良いのか…? 具体的には、 ・Inte…

Swiper、おそらくサイト重いとAutoplayが正しく動かないときがある?

原因は確かじゃないのであれなのですが。まあ備忘録として。メモです。 Swiperっていうスライダーを簡単に作れるライブラリ。 あれで自動再生して、サムネイル機能もつけて、ってのを作ったのですが。 たまにSwiperがエラー起こして自動再生が止まってしまう…

JavaScriptのscrollToはIEとかSafariで効かないからPolyfillで対応

これがIEとSafariでは効かない。 window.scrollTo({ top: 100, behavior: 'smooth' }); 正確に言えばbehaviorが効かない。CSSのscroll-behaviorも同じく。 jQueryでanimateさせればよかったかもしれないが、今回はPolyfillで解決。 scroll-behavior-polyfill…