jQuery

FullCalendarでGoogleカレンダーのようなUIを実装

jQueryプラグインFullCalendarのサンプル 概要 FullCalendarを使用して、GoogleカレンダーのようなUIを実装する使用例を紹介します。 ダウンロード https://fullcalendar.io/download/ こちらのサイトからファイルをダウンロードします。 ダウンロードしたファイルを解凍し、含まれている以下のファイルを使用し...
2017/01/19

jQuery UI ドラッグ&ドロップで並び替え　sortableの使用方法

sortable 概要 jQuery UIを使用して、ドラッグ&ドロップで並び替えを行います。 sortableを使用することで、一瞬で実装できちゃいます。 準備 まずは、 こちらからjQueryをダウンロードします。 次に、 こちらからjQueryUIをダウンロードします。 ダウンロードしたファイルをHTMLで読み込むよう以下のように指定します。 <li...
2016/02/24

jQuery UIでドラッグ＆ドロップ　draggableとdroppableの使用方法

draggableとdroppable 概要 jQuery UIを使用して、ドラッグ&ドロップを行います。 要素の移動やコピーをGUI操作で行うときなどに役立ちます。 準備 まずは、 こちらからjQueryをダウンロードします。 次に、 こちらからjQueryUIをダウンロードします。 ダウンロードしたファイルをHTMLで読み込むため、以下のように指定します。 ...
2016/02/24
ElevateZoom

jQuery ElevateZoom 虫眼鏡や右枠に画像を拡大してルーペ表示

画像をルーペ表示 概要 ElevateZoom　jQueryプラグインを使って、画像を拡大表示する方法を紹介します。 このプラグインを使うことで、虫眼鏡を使っているようなルーペ機能を実装することができます。 画像自体を拡大表示したり、右枠にマウスオーバーされた箇所の拡大画像を表示することも簡単にできちゃいます。 ショッピングサイトなどに ルーペする機能はいろいろな場面で使用できます...
2014/03/24
jQuery webcam plugin

webカメラの操作を行う jQuery webcam plugin

webカメラについて 概要 webカメラとは、www・PCカメラを使用して、撮影された画像にアクセスするリアルタイムカメラ。 ライブカメラということもあります。 これらはwwwでアクセスするため、インターネットに接続されているPCでのみ利用できます。 jQuery webcam plugin jQuery webcam pluginは、webカメラを操作するためのjQueryとFl...
2013/12/23

jQueryでフォームの入力チェック - ValidationEngine

ValidationEngineとは 概要 ValidationEngineとは、Webページのフォームでバリデーション（入力チェック）を行うためのjQueryプラグインです。 バリデーションとは、入力された値が正しいかどうかチェックすることです。 例えば、電話番号入力欄に「足利尊氏」などと入っている場合はエラーにするなど、正しい形式か検証する処理です。 ことなる形式の値が入力された場合...
2013/11/21

Ajax の基礎知識

Ajax 入門 説明 Ajax とはAsynchronous JavaScript + XMLの略で、Ajaxライブラリを使用したJavaScriptのプログラミングです。 有名なライブラリは、prototype.jsやjQueryなどです。 Asynchronous とは「非同期」という意味です。 通常ブラウザとサーバーが同期してやり取りを行い処理されるのですが、このAjaxは非同期で...
2013/10/11

めちゃくちゃ使いやすいスライダー - jQueryプラグイン「bxslider」

これは使いやすい！ 概要 bxslider というjQueryプラグインの紹介です。 これを使用することでとても簡単にいろいろなスライダーを実現することができるのです。 あまりjQueryに詳しくない方でも、これなら簡単に設定できちゃいます。 是非お試しください。 ダウンロード さっそくダウンロードしてみましょう。 bxslider 右上の「Download」をクリックするこ...
2013/10/08

マウスオーバーで画像をズーム表示するjQueryの紹介

画像をズーム表示 zoom jQuery マウスオーバーで画像をズームして表示するためのjQueryプラグインを紹介します。 大きな画像を表示したいがその画像ば場所をとるのは避けたい。 そんな時に、小さい枠で表示しておきマウスを載せた箇所が拡大表示されるためとても便利です。 ダウンロードはGitHubから行えます。 ダウンロードしたディレクトリ内の「demo.html」を見るこ...
2013/10/07

Adaptor エフェクトの種類が豊富なjQueryスライダー

Adaptorの紹介 AdaptorとはイメージをスライドするためのjQueryプラグインです。 切り替え時のエフェクトの種類が豊富であり、表示時間がプログレスバーで表示されるなどの機能もあります。 スライド時のエフェクトの種類が多いのは特に魅力的ですね。 様々な種類のプラグインが存在しますが、これはその中でも使いやすのではないでしょうか。 ダウンロードはGithubから行えます。 サ...
2013/10/04
トップへ戻る