タグ

JavaScriptとjqueryに関するurza358のブックマーク (33)

  • Top 5 : Best free jQuery and JavaScript Dynamic Gantt Charts for web applications

    See our collection from 5 of the best free dynamic (non static gantt charts) Gantt charts JavaScript plugins. If you are working in project management or have a position that involves scheduling tasks and resources, then the therm Gantt chart won't probably sound unknown for you. With a Gantt chart you will have, at your disposal, a very clear view of all the activities scheduled, how long each ac

    Top 5 : Best free jQuery and JavaScript Dynamic Gantt Charts for web applications
  • GitHub - techlab/jquery-smartwizard: The awesome jQuery step wizard plugin

  • フォームをぐっと使いやすくする!ウィザード型jQueryプラグイン6選【2017年版】

    Webサイトのフォームの作成にはjQueryのプラグインが便利。中でも対話形式の使いやすいフォームを作成できるjQueryプラグインを厳選して紹介します。 ページの更新がなく、指示に沿って記入できるjQuery用のウィザード形式のフォームを作成するためのjQueryプラグインがあります。ユーザーデータを一度に入力させる大きなフォームなら、ウィザード形式に変えることで、小さなステップの入力に分割できます。これならユーザーが長い入力フォームにうんざりすることもなくなり、進行状況も示しせます。 この記事ではおすすめjQueryフォームウィザードを6つ、それぞれの特徴を踏まえて紹介します。有料版や自作する方法も少し触れます。jQueryのフォームウィザードを求めている人の助けになれば幸いです。 1.jQuery steps jQuery Stepsはウィザード型のインターフェイスを簡単に作れる気の

    フォームをぐっと使いやすくする!ウィザード型jQueryプラグイン6選【2017年版】
  • 12 Awesome jQuery Virtual Keyboard Plugins | Learning jQuery

  • jQueryでページ読み込み中にローディング画面を表示する方法|Gimmick log

    TOPjQuery jQueryでページ読み込み中にローディング画面を表示する方法 jQueryでページ読み込み中にローディング画面を表示する方法 公開日:2015.11.20 更新日:2020.05.19 jQuery, ローディング jQueryでローディング画面を実装しました。 全てのページの内容が読み込まれたらローディング画面が非表示になる仕様です。 2GRAVITY様の方法を参考にさせていただいています。 jQueryを使わずにjavaScriptで実装するプラグインはこちら デモページ 実装方法 html ロード画面とロード後に表示させたい要素を個別に括っておきます。 <div id="loader-bg"> <div id="loader"> <img src="img-loading.gif" width="80" height="80" alt="Now Loading.

    jQueryでページ読み込み中にローディング画面を表示する方法|Gimmick log
  • [jQuery] ローディングのクルクルを瞬殺で実装する【2019】

    2019.3.29 更新 この記事を書いてから数年経ち、今ではもっとカンタンに実装できる方法がたくさん出ています。 今回はJSとCSSをCDN(ファイルをサーバーにアップしなくても、コードを書くだけでプラグインを実装できる方法)で読み込むだけでカンタンにこんなものも実装できます!というご紹介を追加します。 サンプル PACE.js プラグインを読み込む PACE — Automatic page load progress bars このプラグインを使ってカンタンなページローディングを実装してみます。 CDN一覧のページから、JSのコードをコピーします。 pace – cdnjs.com – The best FOSS CDN for web related libraries to speed up your websites! 「https://〜〜pace.min.js」と書かれてい

    [jQuery] ローディングのクルクルを瞬殺で実装する【2019】
  • jQueryのプチプラグイン化でjQueryを使った関数を広く使えるようにする | スターフィールド株式会社

    jQueryを使うと、簡単に関数を組むことができますが、 jQueryの性質上、$(function(){・・・});の中に書いた関数は、その中でしか呼び出すことができないため、 サイトの規模が大きくなってくると、ファイルを分けて必要なときだけ呼び出したいときなどに、不都合が生じます。 例: $(function(){ example("#nav");//呼び出し可能 //呼び出したい関数 function example(elm){ elm = $(elm); elm.fadeOut(); return true; } }); $(function(){ example("#nav");//ここからだと呼び出せない });

  • .attr() | jQuery API Documentation

    The .attr() method gets the attribute value for only the first element in the matched set. To get the value for each element individually, use a looping construct such as jQuery's .each() or .map() method. Using jQuery's .attr() method to get the value of an element's attribute has two main benefits: Convenience: It can be called directly on a jQuery object and chained to other jQuery methods. Cro

  • jQueryによる要素の存在チェックまとめ

    jQueryによる要素の存在チェックまとめです。 jQueryを実行する際、「$(selector)」が成功してjQueryオブジェクトが生成されたことを判断したいケースがあるかと思います。なかったらすいません。 ということで、jQueryで要素(jQueryオブジェクト)が1つでも存在することをチェックする方法を調べてみました。実際に動かした結果でまとめてます。 サンプルはscript要素で括ってますが、必要に応じて「$(function(){ ... });」などで括ってください。間違った情報・表現等がありましたら適宜修正しますのでご指摘ください。 1.$(selector)[0] 「$(selector)」で生成されるjQueryオブジェクトは配列のように扱える(配列の基メソッドが使える訳ではない)ので、0番目の要素をチェックすることで存在チェックを行えます。 <script> i

    jQueryによる要素の存在チェックまとめ
  • jQueryを使い始めたときに感じる13の疑問 : tech.kayac.com - KAYAC engineers' blog

    来週は私が夏休みなので更新はない予定です。agoです。 最近、人にjQueryを解説する機会があったので、昔を思い出してjQueryを使い始めた頃に感じる疑問を書いてみたいと思います。 1 そもそも何で使うの?いまでも困ってないよ 作成する内容にもよりますが、慣れると使用しない場合に比べて記述するコード量が3分の1程度まで減ります。 また、変数、条件分岐、繰り返しが減るのでバグが発生しにくくなります。 2 何か特殊なことができる? 結局できることは変わりません。 jQuery自体JSで書かれてますし、記述の自由度もJSの制約に制限されます。 3 何が難しいの? 文法がややjQuery的になります。 参考 jQuery言語入門 jQuery自体のコード量は少ないのですが、独特の記述法が多く慣れるまで多少時間がかかるかもしれません。 また、CSS Selectorの知識はほぼ必須です。 特にマ

    jQueryを使い始めたときに感じる13の疑問 : tech.kayac.com - KAYAC engineers' blog
  • jstree

    jsTree is jquery plugin, that provides interactive trees. It is absolutely free, open source and distributed under the MIT license. jsTree is easily extendable, themable and configurable, it supports HTML & JSON data sources and AJAX loading. jsTree functions properly in either box-model (content-box or border-box), can be loaded as an AMD module, and has a built in mobile theme for responsive des

    jstree
  • jquery.dgtable - 高パフォーマンスなテーブルライブラリ MOONGIFT

    社内システムにおいて、検索結果の一覧表示はよくある機能です。100行程度のデータであれば問題ありませんが、10万行をHTMLで出力するとなれば表示方法を考えなければなりません。レンダリングだけで数分待たされていたら、担当者はストレスを感じることでしょう。 今回は大量のデータ表示を行う場合に使えるjquery.dgtableを紹介します。 jquery.dgtableの使い方 jquery.dgtableは特に表示やスクロールのパフォーマンスに重点を置いています。 複数カラムを指定したソートにも対応しています。 jquery.dgtableは100万行くらいの表示であれば難なくこなします。さらにソート、カラムの移動や幅の変更、マウスオーバーですべてのデータ表示といった機能があります。多機能ではありませんが、大量のデータを表示する際には導入検討したいライブラリです。 jquery.dgtabl

    jquery.dgtable - 高パフォーマンスなテーブルライブラリ MOONGIFT
  • $.ajax() | jQuery 1.9 日本語リファレンス | js STUDIO

    Ajaxリクエストを送信するオプションをキーと値のペアで指定します。 このオプションに初期値を設定したい場合は、 $.ajaxSetup()を使用します。 .ajax( url[, settings] ) 1.5追加 .ajax( [settings] ) 1.0追加 settings引数について jqXHRオブジェクトについて コールバック関数キューについて データタイプ(dataType)について サーバへのデータ送信について 高度なオプション Ajaxの拡張 コンバーターの使用 サンプル .ajax( url[, settings] ) 1.5追加 戻り値:jqXHR 引数説明

  • jQueryのDeferredを用いたモダンなAjax処理の書き方

    目次 jQuery 1.4以前の書き方jQuery 1.5以上の書き方jQuery 1.8以上の書き方【発展編1】Deferredを用いた書き方 deferredとは何か?【発展編2】$.when() を用いた書き方参考エントリは軽めのjQuery Advent Calendar 2012の14日目の記事として書きます。軽めといいながら少し重めになってしまった感がありますが、初めてのAdvent Calendar参加ということでご勘弁を。 ※ Twitter API仕様変更によりTwitter APIを使ったコード例は現在動作しなくなっていることにご注意。 jQuery 1.4以前の書き方まずは、少し古めのコード、昔のjQueryのとかでよく見る書き方。 $.ajax({ url: "ajax.html", success: function(data) { alert('succes

    jQueryのDeferredを用いたモダンなAjax処理の書き方
  • jQuery.ajaxにCacheが残って困ったら設定 - Qiita

    概要 よく使っている🔗jQuery.ajax()のCacheのため、 いつ困るかと対応する方法に対して説明を差し上げます。 ※ ajaxとはAsynchronous Javascript And Xml(非同期方式のJavascriptとxml)でブラウザーXMLHttpRequestのオブジェクトを利用して画面のリロードせずに内部(外部はjsonp方式)で通信する方法 ちなみに、jQuery.ajaxには色々設定が出来ますので、 以下のリンクを参考して合わせましょう。 🔗jQuery.ajax() 🔗[JavaScript]知っておいたら良いjQuery.ajaxの有用な設定項目(準備中) いつ困るか 例で、ざっくりテストしました。(Request Type : GET) ・サーバ側に存在しているjsonファイルtest_1,2,3を呼んでいます。 ・サーバ側に存在していないjso

    jQuery.ajaxにCacheが残って困ったら設定 - Qiita
  • jQuery File Browser - Webベースのファイルブラウザ

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました ユーザ向けにストレージに開放しているサービスの場合、ファイル一覧やファイルを開くような機能を提供したいと思うでしょう。かといって使い勝手の良いインタフェースは難しく、ツリービューを使ったりします。 もっとインタラクティブなファイル管理機能を提供したいならばjQuery File Browserを使ってみましょう。 jQuery File Browserの使い方 メイン画面です。フォルダやファイルの種類によってアイコンが違います。 フォルダをクリックするとディレクトリを辿れます。 ファイルの種類によって内容が確認できます。 jQuery File BrowserはOS標準のようなファイル管理機能を提供します。慣れたユーザにとってはツリービューの方が効率的かも知れませんが、はじめてのユ

    jQuery File Browser - Webベースのファイルブラウザ
  • jExcel - Webに埋め込んで使えるExcel風表計算

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 業務システムなどで一覧表を表示する場合、主に2パターンあると考えます。一つは画面全体に表示する検索結果的な画面、もう一つはマスター管理など小さな表を幾つか並べる場合です。 今回紹介するjExcelはどちらかというと後者の、小さな表を埋め込み表示するのに便利なライブラリです。 jExcelの使い方 こんな感じに表示できます。 セルをクリックして編集もできます。 複数の表を埋め込むこともできます。 ソートも使えます。 入力値のフォーマットも指定できます。 カレンダー入力も。 ドロップダウンからの選択やチェックボックス入力。 データをJSONやCSVで取得できます。動いていないように見えましたが、関数式もサポートされているとのことです。 jExcelはとても軽量なライブラリで、プラグイン

  • Javascript jQueryで半角・数字・かな入力チェックと数値入力制限する方法 | ホームページ制作のサカエン Developer's Blog

    Javascript、jQueryを使って、半角・数字・かな入力チェックと数値入力制限する方法です。 テキストインプットの入力を制御したい場合って、大きく分けて以下のケースが多いのではないでしょうか? 半角英数字のみ入力可としたい。 半角数字のみ入力可としたい。 ひらがな・カタカナのみ入力可としたい。 入力されたものをチェックしたい場合と、入力自体を制限したい場合がありますね。ここでは、その両方の方法を紹介したいと思います。 先に動作を確認したい方はデモページをどうぞ。 ・デモページはこちら 入力された後、チェックロジックを実行して、正しい入力がされているかを判断する場合に利用します。ここでは、「半角英数字」「半角数字」「ひらがな・カタカナ」のチェックを紹介します。 入力チェックには正規表現を利用します。「半角英数字」「半角数字」の場合、あらかじめ「style="ime-mode: dis

    Javascript jQueryで半角・数字・かな入力チェックと数値入力制限する方法 | ホームページ制作のサカエン Developer's Blog
  • Free jQuery Website Templates (1881) | Free CSS

  • Home - Diamond Casino Online

    Diamond Casino Online Join the high rollers and experience the luxury of Diamond Casino Online.