作成者別アーカイブ: Coding_team

【slick】スライド枚数の異なるスライダー同士の連携

【slick】スライド枚数の異なるスライダー同士の連携

こんにちは、ウェブラボクリエイターズメモです。   以前のクリエイターズメモでスライダーを実装できるjQueryプラグイン「slick」をご紹介しました。     このプラグインは用意されているオプションを設定するだけで実装も可能ですが、もう一歩踏み込んだカスタマイズをすれば、表現の幅がさらに拡がるでしょう。 そこで今回は、スラ…続きを読む

  • このページを共有する

【jQuery】数字入力をアップダウンボタンで複数制御

tecmemo1909

こんにちは、ウェブラボクリエイターズメモです。   ここ最近、数字入力をアップダウンボタンで複数制御する機会があったので備忘録として残しておきたいと思います。   具体的な例を挙げてみると、ECサイトなどで商品の選択画面で   商品の種類は複数選択可 商品を全種類あわせて5個まで選択可能 個数をアップダウンボタンで制御 といった…続きを読む

  • このページを共有する

テキストをポップアップで表示できるプラグイン「Featherlight.js」

ポップアップ

こんにちは、ウェブラボクリエイターズメモです。 今回は、テキストもポップアップで表示できるlightboxを実装するプラグイン「Featherlight.js」を紹介します。 画像だけではなく、テキストやリンクなど、幅広いコンテンツをポップアップとして表示したい場合に活躍してくれるプラグインです。   デモページはこちら。 →DEMO  …続きを読む

  • このページを共有する

【脱jQuery】.load()で別ページから共通パーツを読み込むのをネイティブに書き換え

d7d460796bf7d41a40f47c8cf29b708e_s

こんにちは。なかなか梅雨が明けずバイク乗り、自転車乗りの方はロードバイクに跨がれない季節を迎えていますが、今回はroadではなく、loadです。ウェブラボクリエイターズメモです。   過去の記事で「jQueryで外部にあるHTMLを読み込む」について書きましたが、 今回はそれをもっと簡単に記述できるjQueryの「.load()」メソッドと、ネイテ…続きを読む

  • このページを共有する

スマートフォンのブラウザでもPDFを閲覧できる「PDF.js」

スマートフォンのブラウザでもPDFを閲覧できる「PDF.js」

こんにちは、ウェブラボクリエイターズメモです。   皆さんはスマートフォン上でWebサイトからPDFファイルを閲覧するとき、操作が手間に感じたことはありませんか?     当たり前のように使用しているPDFですが、PDFの閲覧には専用のビューアが必要なため、一部の環境では閲覧に手間取ってしまうことがあります。   特に…続きを読む

  • このページを共有する

HTMLで組んだテーブルをエクスポートできるjQueryプラグイン「TableExport.js」

tecmemo1905

こんにちは、ウェブラボクリエイターズメモです。   今回はHTMLで組んだテーブルをエクスポートできるjQueryプラグイン「TableExport.js」を紹介したいと思います。 xlsx、csv、txtなどの形式にエクスポートできる非常に優れモノです。   まずは以下から一式ダウンロードしましょう。   →GitHub &n…続きを読む

  • このページを共有する

ドラッグ&ドロップでファイルをアップロードできるプラグイン「Dropify.js」

tecmemo190420

  こんにちは、ウェブラボクリエイターズメモです。 今回は、フォーム内にファイルのアップロードボタンを実装する際に、ドラッグ&ドロップでファイルをアップロードできるようになるプラグイン「Dropify.js」を紹介します。   デモページはこちら。 デフォルトのアップロードボタンでは、参照ボタンをクリックしてファイルを選ぶ必要があ…続きを読む

  • このページを共有する

流行りの流体シェイプを作ろう

11111

こんにちは、ウェブラボ技術メモです。 今回は今年流行している、「流体シェイプ」についてご紹介します。   ■流体シェイプの使われているWebサイト 2019年に流行するWebデザインの手法に流体シェイプがあるのはご存知ですか? 以下のWebサイトでは流体シェイプが使われているWebサイトをまとめているのでぜひ参考にして見てください。 参考Webサイ…続きを読む

  • このページを共有する

iOS一部バージョンのSafariで高さを取得するときに気を付けたいこと

iOS一部バージョンのSafariで高さを取得するときに気を付けたいこと

こんにちは、ウェブラボクリエイターズメモです。 今回は、iOSの古いバージョンで表示検証をする際に気を付けておきたいことを備忘録として残します。   スマホでグローバルナビゲーションをハンバーガーメニューとして表示させることはよく使われる手法かと思います。 その際にメニュー内のコンテンツが多いと、スマホ画面の高さを超えてしまうことがあります。 &n…続きを読む

  • このページを共有する

誰でも簡単に使えるスクロールに連動するエフェクト「AOS」

tecmemo1804

こんにちは、ウェブラボクリエイターズメモです。 今回は、HTML、CSS、jacascriptに関する知識がほとんど無くても簡単にスクロールに連動したエフェクトを実装できてしまう「AOS」を紹介したいと思います。 「AOS」はjQueryが不要なjavascriptのプラグインで非常に軽量であり、多機能です。 導入もとても簡単なので、「エフェクトをいちいち作…続きを読む

  • このページを共有する