[B! プラグイン] kjtecのブックマーク

[JS]モーダルウインドウを設置するスーパーシンプルなスクリプト -leanModal

モーダルウインドウを設置する必要最小限のカスタマイズを備えた超軽量のjQueryのプラグインを紹介します。デモページ：サインアップフォーム leanModalの主な特徴モーダルウインドウが簡単に実装できます。超軽量（780バイト）です。幅と高さをカスタマイズできます。画像は使用しません。 1ページに複数のモーダルボックスを設置できます。ログインフォーム、サインアップフォーム、アラートパネルなども可能です。オーバーレイはスタイルシートで簡単にカスタマイズできます。非対応スーパーシンプルなため、下記には対応していません。ギャラリー機能 iframeコンテンツの表示 AJAXコンテンツの表示 IE6 leanModalの実装 Step 1 「jquery.js」と当スクリプトを外部ファイルとして記述します。 <script type="text/javascript" src

kjtec 2018/12/21

“leanModal”

リンク

Googleの新ツールが便利すぎる！デザイナーやディレクター向けの新しいデザインツール -ProjectVisBug | コリス

VisBugはChromeの機能拡張で、ブラウザに表示したページのデザインやコンテンツを検証・編集できます。グリッドの確認はもちろん、要素を移動させたり、入れ替えたり、別の画像にしたり、テキストを編集したり、カラーを変更したりなど、さまざまなアイデアを実行・テストすることができます。制作や検証時だけでなく、クライアントとの打ち合わせ、社内ミーティングなど、活躍するシーンがたくさんある便利ツールです。 VisBug -GitHub VisBugの特徴 VisBugのインストール VisBugの機能 VisBugの特徴 VisBugはChromeの機能拡張で、デベロッパーツールのデザイナーやディレクター向けという感じです。開発者のAdam Argyle氏は、Googleの現役UX エンジニア。機能拡張なので、使うのは簡単です。 Chromeで当ブログを表示し、VisBugを起動してみました。

kjtec 2018/12/21

リンク

jQueryプラグインを自作するには？（$.fn） - Build Insider

← 前回連載 INDEX 次回 → jQueryでアプリを開発していて、似たようなコードを何度も見かけるようになってきたら、プラグイン化することを検討すべきです。本サイトでも、jQuery UI、jQuery Mobileなどのプラグインを解説していますが、こうしたプラグインは︵もちろん︶自分でも作成できます。何度も利用するような機能は、無秩序に自己流の関数／クラスライブラリにしてしまうのではなく︵ましてや、似たようなコードをコピペするのではなく︶、プラグインとしてまとめることで、利用する際にも一貫性を維持でき、結果としてコードの見通しもよくなります。本稿では、confirmプラグインの作成を通じて、プラグインの基本を学びます。confirmプラグインは、ボタンクリック時に確認ダイアログを表示して、﹇OK﹈ボタンが選択された場合は後続の処理を継続し、﹇いいえ﹈ボタンが選択された場合には

kjtec 2017/08/17

自作

リンク

GitHub - loopj/jquery-tokeninput: jQuery plugin which allows your users to select multiple items from a predefined list

jQuery Tokeninput: A Tokenizing Autocomplete Text Entry Overview Tokeninput is a jQuery plugin which allows your users to select multiple it ems from a predefined list, using autocompletion as they type to find each it em. You may have seen a similar type of text entry when filling in the recipients field sending messages on facebook. Features Intuitive UI for selecting multiple it ems from a large l

kjtec 2017/02/16

リンク

テキストエリアを自動的にリサイズしてくれる「Autosize」

「Autosize」は、テキストエリアのサイズを入力文字数によって自動的に変更してくれるjQueryプラグインです。標準では、枠を超える文字数を入力するとスクロールバーが表示されますが、かわりに建増ししてくれます。ダウンロード CDN スクリプト <script src="jquery.min.js" type="text/javascript"></script> <script src="jquery.autosize.js" type="text/javascript"></script> 実装 <textarea id="text1018"></textarea> <script type="text/javascript"> $(document).ready(function(){ $('textarea').autosize({ // append: "\n" // 内部に

kjtec 2017/02/13

リンク

Demo: Sweet Alert | cupOF Interests

プログラミングやITニュースなどを紹介するサイト

kjtec 2017/02/13

リンク

PhotoSwipeプラグインの使い方！スマホサイトのギャラリーに使える！ | SHINGO IRIE

スマホサイト向けのサイトで、写真をたくさん見せたい時に使えるライブラリ「PhotoSwipe」が便利です。タッチすると全画面で表示して、次へ次へとスワイプも可能です。 PhotoSwipeの使い方各ファイルをダウンロードまずはPhotoSwipe公式サイトから、ファイル一式をダウンロードします。 Script/CSSファイルを読み込み<link href="photoswipe.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="klass.min.js"></script> <script type="text/javascript" src="code.photoswipe-3.0.4.min.js"></script> 起動<script> (function(window, Pho

kjtec 2017/01/16

リンク

はてなブックマーク

タグ

関連タグで絞り込む (4)

プラグインに関するkjtecのブックマーク (7)

お知らせ

今週のはてなブックマーク数ランキング（2024年6月第3週）

今週のはてなブックマーク数ランキング（2024年6月第2週）

月間はてなブックマーク数ランキング（2024年5月）

公式Twitter

キーボードショートカット一覧

はてなブックマーク

公式Twitter

はてなのサービス