Top 5: Best tree view jQuery and Javascript plugins
See our review from 5 of the best tree view plugin to display hierarchically folders in your project. You may want to leave aside the task of create your own treeview for display a filelist or other kind of treeview as there are many plugins that does the trick for you. These treeview plugins are the best Open Source TreeView plugins that you can find for javascript and jQuery. 5. jQuery file tree
CORSでハマったことまとめ - pixiv inside [archive]
こちらは ピクシブ株式会社 Advent Calendar 2014 の12/16の記事です。 こんにちは、エンジニアの@dnskimoです。 先日、はじめてCORSを実装する機会があったので、覚書がてらまとめておきたいと思います。 CORSとは Cross-origin resource sharingの略です。 読み方は「コルス」でいいんでしょうか？ Same-Origin Policyに弾かれずに、異なるドメイン間でリソースを共有する仕組みです。 2014年1月にW3C勧告になり、JSONPに替わる方法として徐々に普及してきているようです（要出典）。 アクセスコントロールの仕様も定義されているので、特定のサイトからのみ利用可能なAPIを作る際などに便利です。 JSONPのような「裏ワザ」的な方法ではないところも個人的に好みです。 詳しいことはネット上に素晴らしい記事がたくさんあるので
![CORSでハマったことまとめ - pixiv inside [archive]](https://cdn-ak-scissors.b.st-hatena.com/image/square/5f6a93da881857fccf6161c1a2f6935458bfbb97/height=288;version=1;width=512/http%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fd%2Fdevpixiv%2F20141216%2F20141216151227.jpg)
jQueryの基本 - $(document).ready - Qiita
これは画像などを除いて、HTML=DOMの読み込みが終わったらfunction()の中の処理(=なにかしらの処理)を実行するという意味です。 jQuery(JavaScript)はHTMLが完全に読み込まれないまま何か処理を実行すると大抵正しく動作しません。なのでこのreadyを使うことになります。 $(function(){ //なにかしらの処理 }); jQuery(document).ready(function() { //なにかしらの処理 }); jQuery(function(){ //なにかしらの処理 });
画面読込中のグルグルまわるローディング画像を出す。jQuery・javascript : 森のコーディング
8月28 画面読込中のグルグルまわるローディング画像を出す。jQuery・javascript カテゴリ:javascriptjQuery Tweet 画像がいっぱい並んでるページなんかは、データが重くなるので、ページの表示に時間がかかる。 そんなときは、まっしろいまま待たせるんじゃなくて、 せめて、 「今ローディング中ですよー」 という、このグルグルまわるアニメーションを出してあげると、 少しはイライラが軽減される。 （ほんの少しだけ） それを、javascript ＆ jQueryでシンプルに実装するのを説明します。 サンプルをつくったのでまずは確認。 あぁ、ネコかわいいよ、、ねこ・・。 1.まずはローディング画像を用意 あのグルグルまわってる画像 はGIFアニメで作られてる。 適当に「loading画像」 で検索してきてもいいし、 こういうジェネレータサイトみたいなのもある。 htt
Node.jsで現在のURLを取得する方法 - 動かざることバグの如し
今までのクライアントサイドのJavascriptなら location.href で現在のURLを取得できていたけどNode.jsの場合はそうはいかない var body = req.protocol + '://' + req.headers.host + req.url; でいける
jQueryのajax()を利用すると返り値をとりたいときのやり方 - Qiita
function test(){ $.ajax({ type: 'GET', url: 'http://kitagawa.keiko' dataType: 'text', success: function(response){ return response; }, error: function(response){ return response; }); } var result = test(); // undefined 原因 ajax()はデフォルトで非同期通信をするため。非同期通信はレスポンスが返る前に次の処理にいく。 解決策 基本的には2番めの方がおすすめ。 その１．同期通信にする async: falseとすると、同期通信になる。 ただし同期通信の場合は時間がかかる処理をすると、その間UIがロックされてしまう。なのであまりやらない方がいい。 function test(
CMS.js - クライアントサイドで動作するCMS MOONGIFT
Webサイトの基本といえばCMSです。そのため、Web表示に使えるプログラミング言語があればまず作られるのがCMSと言えます。 今回紹介するCMS.jsもそんなCMSの一つです。プログラミング言語としてJavaScriptを使っています。 CMS.jsの使い方 CMS.jsはJekyllを使っており、実際の描画はクライアントサイドだけでできるようになっています。こちらは設定ファイル兼、スクリプトとなっています。 トップページです。記事が一覧表示されます。 記事詳細。 アバウトなどのページ機能もあります。 リンク一覧です。 CMS.jsはJavaScriptだけなのでどんなWebホスティングでも使える一方、サーバサイドのレンダリングを行っていないのでSEOに弱いという問題があります。社内であったり、ログイン後にしか使えないサイトであれば良さそうです。 CMS.jsはJavaScript/no
node.js製CMS「Apostorophe」を試す - Qiita
この記事は J2complexed Advent Calendar 2016 の17日目の記事です。 遅れました。 だんだん書くことがなくなってきたので、引き出しの中から引っ張りだしてきます。 ほとんどWordpress一強の時代が長く続いているようなCMS界ですが、ほかにも星の数ほどCMSはあるので、いろいろ試してみるのもよいのかもしれませんですね。 フロントエンだーとしては、フロントで完結できるCMSならば、さくっといけるんではないかと思ったりするので、そんなこんなでnode.js製の「Apostorophe」をちょっと触ってみました。 node.js + mongoDB 製のCMS テンプレートエンジンはNunjucks （つよそう / Heavily inspired by jinja2 らしい） 管理画面がなく、ログイン後に、ページや要素に対して直接編集・追加していくスタイル。
Scrum Board - カンバン機能だけを取り出したJavaScriptライブラリ
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました GitHubがIssuesをカンバン風に表示する機能を提供するようになっていますが、Issuesを使っていない場合もあります。自社のタスク管理を使っていて、カンバン機能だけを取り入れたいと考える人もいるでしょう。 そんな方に使ってみて欲しいのがScrum Boardです。JavaScript製のカンバンライブラリです。 Scrum Boardの使い方 Scrum Boardの画面です。 エディットモードになると情報が増えます。 ドラッグ&ドロップで移動できます。 タスクの追加画面です。 日本語のタイトルは残念ながら文字化けしてしまいました。 Scrum Boardはバックエンドのないカンバンシステムなので、データをJSONなりで与えるようにすれば既存のシステムと連携させることもでき
Android とNode.js とsocket.io 簡単なチャットやり取り - Qiita
大事なお知らせ node.js v7.2.1 socket.io 1.7.1 等々、最新のバージョンを用いてsocketio通信を行えることを確認しました。 なので以下の続きは書きません。 その代わり、時間はかかりますが新しいバージョンに対応した チャットの作成を行いたいと思います。 いいね等をしてくれた方々、誠に申し訳ございませんが どうぞご理解の程、よろしくお願いします。 ある程度の作業が済んだのでこれから少しずつ書いて行こうかと思います。 内容としては ・socket.ioとandroid studioとnode.jsの通信、チャット ローカルのみ対応（10.0.2.2:8000とかとか） ・socket.io(?)とandroid studioとnode.jsの通信 ログインのみ 少し広めのローカル対応(ipv4アドレスで開いたサーバに接続できます) 以上、２点の内容を書いてみよう
GIFアニメーションを再生し終えてから次のGIFを表示するElectronアプリを作っていました - Qiita
作っていました。 khsk/electron-gif-loop: Gifyからgifを取得し、最低1ループはアニメを見せるgifビューワー 備忘録。 特徴 最低1ループはアニメーションを見せる、スライドショー的gifビューワーです。 GIPHY からgifを取得しつづけます。 任意のタグを複数登録することで、好きなジャンルのgifを表示できます。(精度はGIPHYAPIに依存します) 可能な限り、ループの終了直後に次の画像を表示します。 画面のリサイズと移動が可能です。 常に前面表示の切り替えが可能です。 デモ 動機 昔からgifアニメの扱いに難儀していた。 静止画ほど気楽に流し見できないし、ループしてから次の画像へ移るのも最初の部分を2回見ることになってもやもやする。 スライドショーにまじると途中までしかアニメがみれないor短いアニメが繰り返しすぎてもやもやする。 最低1回はアニメーショ
Node.js(Express)とthree.jsで一通りウェブサイトつくって公開した記録(初心者向け) - Qiita
この記事はThree.js Advent Calendar 2016の10日目の記事です。 はじめに この記事は「初心者がThree.jsとか使ってなんとか簡単なウェブサイト作って公開した」記録です。なので内容は教科書レベルだと思います。 「Three.jsでとりあえず球体浮かべてみたけどその後何しようか自分でもわからない」「ExpressでHello Worldしてみたけどそれから何したらいいのか」という人の参考になれば光栄です。 Three.js Advent Calendarの記事の割にThree.jsに関係ないことが半分くらい占めそうです、すみません。 環境 さくらVPS (Apache 2.2.15) Node.js v6.5.0 Express v4.13.4 three.js r81 ちなみにローカルはWin10です。エディタはAtom、ターミナルはCmder、転送ツールはW
JavaScriptの「Object」「Global」オブジェクト、「NaN」「URI」エンコードの基本
書籍の中から有用な技術情報をピックアップして紹介する本シリーズ。今回は、秀和システム発行の書籍『JavaScript Web開発パーフェクトマスター（2015年6月27日発行）』からの抜粋です。 ご注意：本稿は、著者及び出版社の許可を得て、そのまま転載したものです。このため用字用語の統一ルールなどは＠ITのそれとは一致しません。あらかじめご了承ください。 これまでに、いくつかのビルトインオブジェクト（JavaScriptに用意されている組み込みオブジェクト）について見てきましたが、これらのオブジェクトを扱うためのオブジェクトというものが存在します。それがObjectオブジェクトです。 でも、いったいオブジェクトを扱うためのオブジェクトなんて何の役に立つのでしょうか。その辺りのことをポイントに、Objectについて見ていきたいと思います。 Objectオブジェクトは自身の機能を使わせるために
JavaScriptで履歴を扱う「History」、URLを扱う「Location」などの基本
書籍の中から有用な技術情報をピックアップして紹介する本シリーズ。今回は、秀和システム発行の書籍『JavaScript Web開発パーフェクトマスター（2015年6月27日発行）』からの抜粋です。 ご注意：本稿は、著者及び出版社の許可を得て、そのまま転載したものです。このため用字用語の統一ルールなどは＠ITのそれとは一致しません。あらかじめご了承ください。 ビルトインオブジェクトには、Webブラウザーの種類やOSの種類を格納しているものや、表示中のURLを管理するオブジェクト、さらには閲覧履歴を管理するオブジェクト、ブラウザーを表示しているモニターの情報を管理するオブジェクトがあります。 これらのオブジェクトを利用することで、ブラウザーの種類によって処理を切り替えたり、ボタンクリックでページ移動、さらにはボタンクリックで履歴を進んだり戻ったりする処理が行えます。 Point ビルトインオブジ
実践！ SpreadJSとASP.NET MVCで帳票Webアプリを作成してみよう
はじめに 第1、2回では、「SpreadJS」の基本的な使い方や、サーバー側のWebフレームワークとしてASP.NET MVCの現状を確認しました。 本稿では、SpreadJSとサーバー側を連携し、実際にとあるシナリオを想定して帳票Webアプリを作成します。サンプルの一部を抜粋しながら、以下の機能がどのように実装できるか、紹介します。 想定シナリオ "請求書"をブラウザ上で表示・編集し、データをサーバー側に保存する。 作成した"請求書"を再度読みこむ。 作成した"請求書"を、印刷・Excelファイルとして出力する。 構成 サーバー側 Web フレームワーク：ASP.NET MVC、ASP.NET Web API クライアント側：TypeScript、SpreadJSライブラリ IDE：Visual Studio 2015 作成する帳票Webアプリの図 数量や単価を変更することで、小計や合計
Electron アプリをつくる時に便利なパッケージ - はやくプログラムになりたい
この記事は Electron アドベントカレンダー2016 の13日目の記事です． 本記事では，僕が Electron アプリをつくる上で便利だったり，ほしかったのでつくったりしたパッケージを7つほど紹介します． electron-about-window electron-dl electron-in-page-search electron-window-state menubar node-auto-launch electron-mocha electron-about-window electron-about-window は 'このアプリについて' ウィンドウを簡単にクロスプラットフォームにつくるためのパッケージです．下記のように関数を1つインポートして呼び出すだけで「このアプリについて」ウィンドウを生成することができます．（example） import openAbout
Shuffle.js - ダイナミックなフィルタ/ソートライブラリ MOONGIFT
多数のリストの中から目的のものを探す際に、多くの人が目検でチェックしたり、Webブラウザのテキスト検索を使ったりします。これは非効率的で、面倒です。技術の力でもっと効率的にすべきでしょう。 とは言え、作り込むのは意外と面倒だったりします。そこで使ってみたいのがShuffle.jsです。 Shuffle.jsの使い方 最初の画面です。すべての要素が出ています。 テキストを入力するとマッチするデータだけにフィルタリングされます。 実際に入力しているところです。 ソートも使えます。検索との組み合わせも可能です。 カテゴリを使ったフィルタリングも行えます。 Shuffle.jsはアニメーションも行われるので、フィルタリングがダイナミックに適用されているのが明確に分かるようになっています。Eコマースサイトの商品一覧などで使ってみても良さそうなライブラリです。 Shuffle.jsはJavaScrip
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript Loading Screen while page loads
JavaScriptプログラミング講座【XMLHttpRequest について】
How to write custom extensions for the Large Model Viewer