Persist your form's data in a browser's Local Storage and never lose it on occasional tabs closing, browser crashes and other disasters!
まず「リスト選択」の列の選択肢から「B」を選択します。 ⇒「リスト名」が「B」に変更されます。(変更)「追加/削除」の列の「+」ボタンを押します。 ⇒行が追加されます。(追加)追加された行の「リスト順」の列の「↑」をクリックします。 ⇒行が上へ移動します。(移動)移動した行の「リスト順」の列の「↓」をクリックします。 ⇒行が下へ移動します。(移動)最後に、好きな行の「追加/削除」の列の「-」ボタンを押します。 ⇒行が削除されます。(削除) いかがでしょうか。まあ、よくある機能ですね。では、この機能の実装方法について以下にまとめておきたいと思います。 HTMLHTMLでは、以下の点がポイントとなります。 それぞれの機能を発生させるためのイベントハンドラをセットしておきます。操作の対象となる「行」の部分は<tbody>タグ内に記述するようにします(これが後々大事になります)。JavaScrip
22 March 2024 Hey there, this is the current maintainer of BrowserFS. I've been working on BrowserFS for over a year now, and have made some big improvements. A few months ago, I began seperating some backends from BrowserFS to be placed into different packages. Along with this, I created the browser-fs organization on Github and the browserfs organization on NPM. I made new organizations to keep
Latest: v4.9.0 (2017-05-03) Demohttps://sutara79.github.io/jquery.add-input-area/ GitHubhttps://github.com/sutara79/jquery.add-input-area 入力欄を動的に増減させることができます。 テキストボックス、テキストエリアの両方に対応しています。 ライセンスMITライセンス (http://www.opensource.org/licenses/mit-license.php) ※改変、再配布はご自由にどうぞ。 使用にあたっての注意点 増減する入力欄には、下記のようにCSSクラスを指定する必要があります。 要素の種類は問いません。 li でも tr でもOKです。 また、子孫関係も、直下に置く必要はありません。 <* id="hoge"> <* class="ho
「jQuery 3.0 Final Released!」などで報じられているように、2016年6月9日にjQuery 3.0がリリースされました。 詳細は様々なブログ等でレポートされていますが、私はjQuery 3.0のスリムビルド版で使用できないメソッド等を調べてみました。 スリムビルド版の概要 まず、スリムビルド版のリリース記事内にはAll in all, it excludes ajax, effects, and currently deprecated code.とあり、AjaxとEffectsが除かれていることが分かります。jQuery 1.8からGruntを利用して必要なモジュールのみをまとめたカスタムビルド版の生成が行えるようになっているのですが、スリムビルド版もこれを利用して生成されているようなので、実際にコードを見てみると次のように除かれているモジュールが記されています
壁に埋め込まれたボタンをピクセル化させてインタラクティブなディスプレイを作成できてしまうのが「AnyPixel.js」です。Googleの開発者たちによって無料でコードが公開されており、誰でも風船や電気のスイッチなどを使って自由に巨大ディスプレイが作成できるようになっています。 anypixel.js http://googlecreativelab.github.io/anypixel/ AnyPixel.jsとは一体どういうものなのか?ということは、以下のムービーから確認できます。 AnyPixel.js - a web friendly way for anyone to make unusual displays - YouTube 大量に用意されたボタン。 これを、巨大な壁一面に設置していきます。 壁の背面はケーブルだらけで…… 前から見るとこんな感じ。 設置が完了したボタンはカ
追記 最新の感想も合わせてご覧ください。 jinjor-labo.hatenablog.com React界隈では結構前から「CSS in JS」と言って、雑に言うと「CSSはイケてないからJSでインラインスタイルを書いてしまえ」という話がある。(ちゃんと知りたい人はこちら) 自分も前々からCSSは変数が使えないとか名前が被るとか諸々イケてないのは同意してたんだけど、じゃあJSで書くのが良いかと言われたら「いや流石にロジック汚れるんじゃね?」とか「CSSの便利機能を捨てて平気なの?」とか色々と懐疑的だったんだけど、1~2か月書いてみたら想像以上に良かったので感想を書くことにした。 まず一番に主張したい部分を先に言うと、こう。 (誤解)JSのコードがスタイル記述で汚れる (正解)JSのコードがスタイル記述から解放される 前提 実際に書いたのはJavaScriptではなくElmなので以下は全て
はじめに React(通称 React.js1)を全く知らない、あるいは幾つか記事を見たけどなんなのかピンと来ていない、という人のために書いています。 「jQuery くらいしか知らない」くらいの人に具体的に雰囲気を知ってもらうのが目的であり、すでにやる気がある人向けのチュートリアルではありません。やる気が出れば日本語版ドキュメントを読んで手を動かせばあっという間なので、そこまでの興味が出ることを目標にしています。 以降では ES2015 (ES6) の文法(アロー関数とか)を使っています。この部分が怪しい人は先にアロー関数と const 文だけでも知ってから先に進んでください。 以下の説明中、このアイコンで表すのは(2023 年現在から見た)『昔話』です。新しく自分のコードを書く際には本来知らなくていいことですが、古い記事を見たときに混同しないための参考情報として書いてあります。この記事
The powerful, in-browser CSV parser for big boys and girls Download Demo Documentation // Parse CSV string var data = Papa.parse(csv); // Convert back to CSV var csv = Papa.unparse(data); // Parse local CSV file Papa.parse(file, { complete: function(results) { console.log("Finished:", results.data); } }); // Stream big file in worker thread Papa.parse(bigFile, { worker: true, step: function(result
2008年05月22日02:30 カテゴリLightweight Languages javascript - String.prototype.tr() released 現代のJavaScriptにはperlのm//相当のString.match()も、s///相当のString.replace()も存在しますが、なぜかString.tr()がなかったので作りました。 /lang/javascript/String.tr/trunk - CodeRepos::Share - Trac String: tr args: stdout: stderr: きっかけは、こちら。 404 Blog Not Found:javascript - 勝手に添削 - textareaの高さを自動調節 var lines = 1; for (var i = 0, l = value.length; i <
テキストで貼り付けたい+ フリーソフトウェア ソフト紹介 たとえばWebブラウザから文字列をコピーしてExcelなどに貼り付けるような場合、フォントサイズなどの装飾やリンクがくっついてきて邪魔なことがあります。「形式を指定して貼り付け」で「テキスト」を選択すれば文字だけを貼り付けられますが、いろいろ貼り付けたいときにいちいち指定するのも面倒です。 「テキストで貼り付けたい+」は、クリップボードからテキスト以外のデータを除去してテキスト(Unicodeテキスト)だけにする変換を行う常駐ソフトです。 使い方 自動変換モード 自動変換モードをONにすると、クリップボードにデータが入るたびに、テキスト以外を除去します。このモードをONにしておけば、ふつうに切り貼りするだけで強制的にテキスト形式で貼り付けされます。 ON/OFF切り替えは常駐アイコン右クリックメニューのほかに、設定したホットキー
「WebAssembly」は、JavaScriptの生みの親のブランダン・アイクが「ゲームチェンジャー」と表現するほど期待されているウェブ向けのバイナリフォーマットです。モバイル端末やIoT端末の普及が見こまれる中、マシンパワーの劣る端末でも効率よく実行できるように、ウェブの標準言語と言ってよいJavaScript以外の言語をコンパイルするためのユニバーサルなローレベルバイトコードが求められていましたが、ブラウザ開発者はそれぞれ独自にツールを開発する状況でした。 そんな中、2015年6月にMozilla、Google、Microsoft、Appleなどのウェブブラウザの主要プレイヤーが標準フォーマットとして開発に合意したのがWebAssemblyで、プロジェクトを推進するWebAssembly Community Groupが結成され、まずはC/C++をコンパイルしてJavaScriptエ
数行のコードJavascriptのみでデスクトップ/モバイルのネイティブVRアプリが構築できる「Renderloop」 2016-03-05 Nicolas Lazareff氏は、「Renderloop」というVRアプリを構築するウェブサイトを発表しました。Javascriptのみを使用して、デスクトップおよびGear VRも含めたモバイルのネイティブVRアプリが構築できるとしています。専門知識があまりなくても、数行のコードだけで360°画像/映像ブラウザ、チャットアプリ、ミニゲーム開発ができると。早期アクセスは、サイトのメールアドレス登録からできます。コーディング、動作している映像もYouTubeで公開されています。
国産のバックエンドサービスとして人気の「Milkcocoa」ですが、いつの間にか「リアルタイムWeb通知」を実現できるようになっていたのでご紹介しておきます! これが出来るようになると、自分のWebサイトやサービスなどを利用しているユーザーに向けて、スマホの「プッシュ通知」のような感覚で、リアルタイムに任意のメッセージを送信し、ユーザーのブラウザ上に表示させるようなことが出来るので便利です。 今回は、チュートリアル形式でサンプルを作っていく過程をご紹介しようと思います! まずは初期設定をしよう! まず最初に「Milkcocoa」にログインし、管理画面から新しいアプリを作成します。(無料プランで問題ありません…)
jQueryプラグイン「JQUERY NEWS TICKER」を使ってみました。これを使えばとても簡単にニュースティッカーを実装することができます。滑らかに流れてくるので爽快です。マークアップはリスト要素を記述するだけなのでシンプルです。あと、オプションでAjaxを使ってフィードのURLを指定するだけで簡単に記事タイトルを流すこともできます。以下、使い方です。 [ads_center] 使い方 以下のURLからダウンロードできます。 jQuery News Ticker head内でjQuery本体とプラグインを読み込みます。 <link href="styles/ticker-style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://ajax.googleapis.c
2015-08-10 iPhoneでひしゃげてしまうバグに対応した、JavaScriptで画像を縮小処理する方法を紹介します。 JPEGの回転情報から正しい向きで表示したり、ジャギーを減らすためにエルミートフィルターを使ったスムージングも行います。 画像を投稿できるサイトなどでは、写真を"魅せる"ためのサイトでない限りディスプレイ幅以上の解像度のデータは必要なく、アップロードされた画像ファイルをサーバ側で縮小処理したデータのみを保存していることも多いのではないでしょうか? iPhoneのOSがバージョン6になってから、ようやくHTMLの<input type="file">がサポートされ、スマホ界隈でも画像投稿が熱くなってる感じがしますが、スマホのカメラはメガピクセルが当たり前なので、そのままだとファイルサイズが1メガ以上になってしまい、通信帯域を無駄に使ってしまいます。 HTML5で実用
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く