webサイトに演出を着せる際に個人的に気をつけたい事項 - Qiita
こんにちは。CSSやJSでwebサイトの演出デモやスニペットを作るのが趣味の者です。 自己紹介用自己満サイト↓ https://kobito.zombie.jp/ 筆者自身は、いわゆる動きのあるサイトが好きで、魅力的な演出を表現しているサイトを見て回ったり気に入った演出を再現するために朝までデモを作ったりしています。が、サイトの演出がうざいという感情を持つこともあります。 自分が作るモノに関しては、できるだけサイトの演出が与えるネガティブな印象を削りたいと思うものです。よって以下は、webサイトに演出を着せる際に筆者個人が心がけようとしている指標たちという主観的箇条書きになります。 そもそもwebサイトの演出は悪なのか？ いきなり否定から入りますが、個人的には「No」です。 webサイトを、演出込みで1コンテンツとして完成させている成果物は多く存在します。 ではなぜwebサイトの演出に対す
react-swipeable-views から Swiper への移行 - Qiita
React でスワイプによるスライドの操作を実装するライブラリ react-swipeable-views が非推奨になりました。この記事では、MUI (旧 Material-UI) のドキュメントに掲載されている react-swipeable-views を使ったコードを代替するライブラリ Swiper に置き換えていきます。 先行記事 【React】Swiper + MUI Tab を利用してスワイプでタブ切り替えを行う https://ramble.impl.co.jp/1959/ 本記事では以上の記事を大いに参考にしていますが、以下の2点で異なります。 TypeScript で記述 react-swipeable-views からの移行を念頭に置いて、その差分を記述 react-swipeable-views react-swipeable-views は React でスワイプ
【React Native】Tinderのカードスワイプアニメーションを実装 - Qiita
はじめに React Nativeアニメーションの再入門ということで、スワイプするごとに重なったカードが続々と表示されていく機能を実装してみました。Classコンポーネントを使った古い書き方で実装している個人記事がほとんどだったので、これからReact Nativeのアニメーションを勉強する方の参考になればと思い、functionalコンポーネント縛りで実装しました。 以下が完成品のGIFです。 今回はReact Native + Expo + TypeScriptの構成で実装しています。Expoの導入手順については公式Docsを参照いただければと思います。 また、説明の都合上、importやstyleの部分をほとんど省略して記載しています。ソースコードの詳細を知りたい方や説明なんていらんという方は、GitHubをご確認ください。 1. 1つのデータを表示する 今回はアニメーションの動作を
【最新】Swiperの使い方・カスタマイズを解説！サンプルやオプション15個付き ー基礎から応用までー | 東京のホームページ制作 / WEB制作会社 BRISK
TOPブログ【最新】Swiperの使い方・カスタマイズを解説！サンプルやオプション15個付き ー基礎から応用までー Webサイトのコーディングをするなら必修とも言えるスライダー。 スライダー実装用のJSプラグインはいろいろありますが、本記事ではその中でもSwiperを使用した実用的なカスタマイズ例をご紹介します。 デモページを見る まずはこちらのデモページをご覧ください。 片方だけはみ出しているスライダー、サムネイルと連動するスライダー、SPだけスライダーにする方法などなど、実際によく必要になる機能を網羅できるようなデモを厳選してご用意しました。 初心者さん向けのかなり初歩的な内容から、いろいろカスタマイズを加えた応用編まで解説していきます。 メインビジュアルの作例5つ（#11 ～ #15）については、Swiperのカスタマイズ方法だけでなく、アニメーションやデザインの参考になればと思い様
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
