Grid.jsを使う方法｜なおしむ
データをテーブル表示するライブラリ『Grid.js』を使ってみたので共有します。 テーブルタグを使って自前で実装すると面倒なソート機能や検索機能や大量データへの対応がカンタンに実装できます。「テーブル表示をするならとりあえず使っとけ」くらいの気持ちで使ってみるのもアリだと思います。 今回はテーブルを表示して行毎に編集ボタンを表示するまでの手順を説明します。 この手順で、用意するファイルはHTMLファイル1だけ、操作はコピペだけでカンタンに使えるので良かったら試してみてください。 Grid.jsとはGrid.jsは、無料でオープンソースのJavaScriptテーブルプラグインです。 特徴は以下の通りです。 本家サイトから引用しています。 React、Angular、Vue、VanillaJsを含むほとんどのJavaScriptフレームワークで動作する ファイルサイズが小さい (12kb) 動
Scriptular - Javascript Regular Expression Editor
Scriptular is a javascript regular expression editor. Inspired by Rubular it gives you a simple way to test javascript regular expressions as you write them. Start by entering a regular expression and then a test string. Or give this example a try. Learn more about regular expressions in javascript.
ドラッグ＆ドロップ－HTML5のAPI、および、関連仕様
■ドラッグ＆ドロップとは ドラッグ＆ドロップとは、ウェブページ内の要素やローカル環境に保存されたファイルなどのデータを、 マウスで引きずるように移動させて他の場所に置く操作のことです。 HTML5以前にも、mousedownやmouseupなどのイベントで実現することはできましたが、 HTML5ではドラッグ＆ドロップ専用の新しいイベントや新しいメソッド・属性が追加されています。 ドラッグ＆ドロップを理解するには、ドラッグ操作とドロップ操作を分けて考えると理解しやすいでしょう。 ドラッグ操作は要素などのデータをマウスでつかんで引きずるように動かすこと、 ドロップ操作はその動かしたデータをドロップ先の要素内に配置することです。 ■HTML側では、ドラッグする要素にdraggable属性を指定する HTML側では、ドラッグする要素にdraggable属性を指定します。 draggable属性の値
「jQueryは大きすぎる」との声に対応、jQueryをモジュラー化、小型化するプロジェクト「jquip」 | OSDN Magazine
jQueryをより小さく、軽量に、モジュラー化することを目指し、「jquip」というプロジェクトが立ち上がった。コア部分である「xjquip.js」ファイルのサイズはミニファイ・圧縮後で4.28KBと小さく、これはjQueryの13％というコンパクトさだという。サイズは小さいもののjQueryの持つ機能の90％を実装、さらにプラグインを追加することでそれ以外の機能も利用できる。 jquipは「jQuery in parts」の略で、「必要なものだけを取り入れる」というコンセプトを持つ。米国在住の開発者、Demis Bellot氏とJey Balachandran氏が始めたプロジェクトとなる。肥大化するjQueryに対し、コードベースの再構成やよりいっそうのモジュラー化のためのフィードバックを送ることを目的にしているとのこと。ライセンスはMIT License。 jquipは$()セレクタや
JavaScriptをもっと上達したい人へのヒント（JavaScript おれおれ Advent Calendar 2011 – 24日目） | Ginpen.com
JavaScript おれおれ Advent Calendar 2011 – 24日目（最終日） JavaScriptを書くプログラマーさんでも、JavaScriptも書くデザイナーさんでも。 僕なんかがおこがましいとは思うんですが。 いっぱい書く とにかく書く事です。何でもいいです。作りたいものがあれば作ってもいいし、面白そうなものを見かけたら真似してみましょう。 ライブラリーやフレームワークは躊躇なく使う 簡単に書けるならそれに越した事はありません。どんどん使いましょう。そもそも便利なライブラリーを習得する事だって大切です。 分かりやすいと最近評判の本ですね。プログラミングの知識が全く無い状態の読者を想定しているそうです。 「Webデザイナーのための jQuery入門」という本を書きました – Takazudo hamalog で、私が書いた本の話に戻りますが、「Webデザイナーのため
PhotoSwipe
What’s new in v5Code quality and rewrite in ES6The script is now distributed as an ES module and does not require a build step to use. The documentation is also updated and now includes more examples. Simpler initialization and dynamic import supportPhotoSwipe now supports dynamic import and does not block page rendering. <script type="module"> import Lightbox from './photoswipe-lightbox.esm.js';
直感的なJavaScriptプログラミングを実現する新ライブラリ「Sugar」 | エンタープライズ | マイコミジャーナル
Sugar is a Javascript library for working with native objects. シンプルで直感的に扱える新しいJavaScriptライブラリが登場した。既存のJavaScriptフレームワークと衝突しないように開発されており、JavaScriptを使った開発効率を向上させるライブラリとして注目される。ライブラリは「Sugar」と呼ばれている。 SugarはJavaScriptのネイティブオブジェクトを拡張するためのライブラリ。一般的なJavaScriptライブラリのように多くの機能を提供するのではなく、ネイティブオブジェクトを拡張することだけに主眼が置かれている。最初からほかのフレームワークと併用することを想定して開発されているため、導入のための敷居が低いところもポイントとなる。 どのような機能がネイティブオブジェクトに追加されるのかは、Sug
はてなブログ | 無料ブログを作成しよう
今の自分は、出会った人や読んできた本によって、できあがっている あの小冊子は、新聞の付録だったのか、記憶が曖昧で定かではないのだが、1ヶ月に1回程度の頻度で届いていた気がする。オールカラーで内容もさまざまだった気がする。その中には、プロ野球の選手名鑑もあって、私は、母から受け取り、大切にしていた記憶がある。母は、…
EExt Japan - Sencha Touch登場 - モバイル用HTML5フレームワーク
Ext CoreはダイナミックなWebサイト構築に最適な軽量かつ高機能なクロスブラウザー対応のJavaScriptライブラリです。その特徴は： ファイルサイズがコンパクトな約25kb (ext-core.jsをgzip圧縮した場合) 柔軟かつ利用しやすいオープンソースライセンスのMITライセンス Ext開発メンバーにより執筆された体系的かつ網羅的な75ページのマニュアル これまでのExt JSを同じ使い慣れた直感的なAPI Ext JS 2.2 Ext JSはリッチインターネットアプリケーション開発のためのクロスブラウザ対応JavaScriptライブラリです。 高性能でカスタマイズ可能なユーザーインターフェイス 優れた設計、文書が豊富、拡張性の高いコンポーネントモデル 商用ランセンスとオープンソースライセンスが利用できます Ext JS 3.0とExt GWT 2.0が
iPhoneのGPSをJavaScriptで操ろう (2/6)
ブラウザーがGeolocation APIに対応している場合は、navigatorオブジェクト内に geolocationオブジェクトが用意されています。geolocationオブジェクトには、現在地の位置情報を求めるためのメソッドが用意されています。 navigator.geolocation.getCurrentPosition() 現在の位置情報 navigator.geolocation.watchPosition() 現在地を定期的に監視 navigator.geolocation.clearWatch() watchPosition()での監視を中止 今回は定期的に位置情報を取得するので watchPosition() を使います。watchPosition() は位置情報を取得したら、最初のパラメーターに指定された関数を呼び出します。たとえば、watchPosition(up
VDS : the Voice Delivery System
Voice Delivery System ホームページ音声読み上げサービスを提供しています。音声読み上げサービスは、インターネットに誰もが使いやすい手すりをつけるをコンセプトにサービスを提供しています。 vds(Voice Delivery System) 私たちは「インターネットに手すりをつける」をビジョンにvdsサービスを提供します。vdsはホームページやウェブアプリケーションのテキスト情報をリアルタイムに音声変換し利用者に届けます。vdsを利用することでホームページを見るメディアから聞くメディアに成長させる画期的なサービスです。また、特殊なアプリケーションを必要とせず、日本語を基本とし多言語（オプション）にも対応したユニバーサルなサービスです。 vdsは３０カ国以上の言語であらゆるWebサイトやWebアプリケーションを「見る」に加え、なめらかな音声読み上げによる「聴く」ことを可能に
iPhoneのGPSをJavaScriptで操ろう (1/6)
JavaScriptの利用範囲がどんどん広がっています。ライブラリの充実によって、比較的手軽にいろいろなことができるようになり、Webサイト／Webアプリケーションだけでなく、今やモバイルデバイスやデスクトップアプリケーションなどの分野でもJavaScriptが活躍するようになりました。 本連載では、多数のJavaScript関連書やASCII.jpの連載「29分でできる！あのサイトの技を盗め」の執筆でもおなじみの古籏一浩氏が、最新のAjax/JavaScriptライブラリの解説から、今後注目される新しいJavaScriptの活用Tipsまで、“楽しくできて役立つネタ”をお届けします。 初回は「iPhone 3GS」に合わせてリリースされたiPhone OSの新バージョン「iPhone OS 3.0」がテーマです。iPhoneならではのGPS機能をSafariのJavaScriptで活用す
Code Syntax Highlighter(Copy&Paste HTML)
Code Syntax Highlighter Copy&Paste HTML about page
fladdict.net blog: イベント・ドリブンなJavaScriptのやり方
Flashでに学ぶ非同期通信のノウハウのって感じのお話。JavaScriptでオブザーバパターンを用いて、イベントドリブンなコード（addEventListener等）をバリバリ書く方法です。 というかFlashで言うところの、mx.events.EventDispatcherクラスの自分なりの移植なわけですけど。 このEventDispatcherクラスを使うと、W3CのDOM3にそれなりに対応した、イベントモデルを自作のJavaScriptのオブジェクトに実装できます。これで素晴らしきイベントドリブンの世界が楽しめます。 function EventDispatcher(){} /** EventDispatcher.initialize( obj ) オブジェクトobjに、W3C DOM3互換のイベント通知機能を追加します。 これによりobjは、onLoad等のイベントを発行すること
ブラウザの種類を判別してそれぞれ別のページに飛ばす - OKWAVE
#2です。 前のスクリプトより、こっちにしたほうが良いみたいです。 <script type="text/javascript"> <!-- if(navigator.systemLanguage) { document.write('（IE4以上への対応）') } else if(navigator.vendorSub) { document.write('（Geckoブラウザ（Firefox含む）への対応）') } else if(window.opera) { document.write('（Operaへの対応）') } else if(navigator.vendor == "Apple Computer, Inc.") { document.write('（AppleWebKitへの対応）') } else { document.write('（不明なブラウザへの対応）') }
第4回 JavaScriptでオブジェクト指向プログラミング ― ＠IT
JavaScriptが、いま注目を浴びている。 JavaScriptがこれだけの注目を浴びた理由の1つとして、Ajax技術の登場とも相まって、JavaScriptに対する確かな理解の必要性が高まったという事情は否定できない。しかし、それだけでは説明できない急速な注目の理由として、もう1つ、JavaScriptという言語そのものが持つユニークさが開発者の目を引いたという点は看過できないだろう。 もっとも、このユニークさは同時に、多くの開発者が感じているJavaScriptに対する苦手意識と同義でもある。これまでVisual BasicやC#、Javaといった言語でオブジェクト指向構文になじんできた開発者にとって、JavaScriptのオブジェクト指向構文はいかにも奇異なものに映るのだ。ようやくクラスという概念を理解した開発者が、JavaScriptという言語の背後にたびたび見え隠れする「プロ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - noflo/noflo: Flow-based programming for JavaScript
ドラッグ＆ドロップ サンプル
Google Code Archive - Long-term storage for Google Code Project Hosting.
GitHub - ffranke/Laker-Compendium: Laker is a compendium of files, frameworks, styles and tips for designing digital publications in HTML5.
