カテゴリー別アーカイブ: Webプログラミング

【CSS】ダークモードに対応する

tecmemo2001

こんにちは、ウェブラボクリエイターズメモです。 2019年9月にiOS13、Andoroid10がリリースされ、ダークモードが実装されました。 誰もが期待していた機能だと思います。夜間だと目に優しいし、消費電力も抑えられますね。 そこで今回はWebサイトのダークモードに対応について簡単に解説します。 実はCSSで簡単に対応できるので多少知識のある方ならすぐに…続きを読む

  • このページを共有する

ボタンごとに印刷エリアを変える

印刷

こんにちは、ウェブラボクリエイターズメモです。 ウェブページを印刷する時に「この部分だけを印刷できたらいいのに」と思った事はありませんか? @media printやprint.cssを用いれば簡単に印刷用のスタイルが設定できます。 しかしこれらはページ全体にかかるスタイルの為、”Aのボタンを押すと任意のAの範囲を、Bのボタンを押すと任意のBの範囲を印刷する…続きを読む

  • このページを共有する

ブラウザごとの最小フォントサイズ一覧

68b1535ea2bf2185acb7b7a82d58834e_s

こんにちは、ウェブラボクリエイターズメモです。   皆さんはブラウザによって、指定できる最小のフォントサイズがあるのをご存知でしょうか?   お恥ずかしながら今までどのブラウザも10pxだと思っていたのですが、 OSやブラウザごとで様々なんですね。   たまにお客さんから、「このエリアもっと小さくしてくれ~」とお願いされることも…続きを読む

  • このページを共有する

【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」を紹介します。   デモページはこちら。 デフォルトのアップロードボタンでは、参照ボタンをクリックしてファイルを選ぶ必要があ…続きを読む

  • このページを共有する