
Swiper.jsにはcreativeEffectというオプションが用意されており、アクティブスライドの前後のスライドに対してかなり自由に変更を加える事ができるため、うまく活用することによってオリジナルのスライダーを作成 […]
Swiper.jsにはcreativeEffectというオプションが用意されており、アクティブスライドの前後のスライドに対してかなり自由に変更を加える事ができるため、うまく活用することによってオリジナルのスライダーを作成 […]
Javascriptのスライダーライブラリの中でも人気がある『swiper.js』はオプションがとても豊富です。当記事ではswiper.jsのオプションを使用してスライダーのアクセシビリティ(操作性)を向上させる方法につ […]
Swiper.jsで作成したスライダーのナビゲーション(矢印)のサイズや位置や色を変更したい時があると思います。当記事ではその方法をデモを交えながら解説します。 通常のSwiper.jsでのスライダーの作成はご存じの前提 […]
Swiper.jsで作成したスライダーのページネーション(ドット)のサイズや位置や色を変更したい時があると思います。当記事ではその方法をデモを交えながら解説します。 通常のSwiper.jsでのスライダーの作成はご存じの […]
当記事では、jQueryなどの外部ライブラリを使用せず、アコーディオンメニューを実装する方法についてデモ付きで記します。 素のJavascriptでアコーディオンの開閉アニメーションを実装しようとすると煩雑になりがちです […]
当記事では、コードの量をなるべく抑えてモーダルウィンドウを実装する方法についてデモ付きで記します。HTML5から導入されたdialog要素を使用する事で手間を大幅に削減できます。 ⓪要件 当記事では少ないコードでモーダル […]
当記事では、ファイル選択時に複数画像をプレビューする方法について記します。 ファイル選択時に画像を1枚だけプレビューしたい場合は下記が参考になるかと思います。【Javascript】ファイルを選択時に画像をプレビューする […]
当記事では、ファイル選択をした時に画像をプレビューする機能をJavascriptで実装する方法について記します。FileReaderを使用したサンプルをよく見ますが、当記事ではFileReaderを使わずに実装してみます […]
当記事では、BlobからFileに変換する方法とFileからBlobに変換する方法を記します。どちらも簡単に行えます。 BlobからFileに変換 FileからBlobに変換 以上、BlobとFileの相互に変換する方法 […]
当記事では、DataURLからFileに変換する方法とFileからDataURLに変換する方法を記します。 DataURL⇒File DataURLからFileへの変換はfetchメソッドとFile Apiを組み合わせる […]