知っている方には、すみません。 HTML5 には contentEditable という属性がありまして、この値が true だと、その要素はブラウザ内で編集可能となります。 ちょっと試してみましょう。 <div contentEditable="true">ここは編集できる</div> ↑ ここは編集できるのです。(ただの <div> 要素なのですが！) 編集内容はどこかに保存されるわけではないので、ブラウザをリロードすれば元に戻ります。 body要素に contentEditable 属性をつけてみる さきほどのボタンでは、クリックすると JavaScript が実行され、<body> 要素の contentEditable 属性を変更しています。結果、ブラウザで表示されるすべてが編集可能になるのです。 JavaScript コードはこんなかんじ。 javascript:(functi
2016年10月27日（木）13時より一部のプレミアム会員を対象に、 新しい動画視聴ページである「動画視聴ページ HTML5版（β）」 （以後、 「HTML5版」と記載）の提供を開始いたしました。 「HTML5版」では、動画再生可能となるまでの速度が、 従来の「動画視聴ページ Flash版」（以後、「Flash版」と記載）と比較して 高速化しており、より快適に動画をご視聴いただけます。 しかしながら「Flash版」で提供中の"シークバー上のサムネイル表示"や"コメントのNG追加"などの一部機能や導入を計画中の新規機能につきましては、追っての提供予定となるため、今回、β版での提供とさせていただいております。 β版提供期間中は、「HTML5版」と「Flash版」の新旧動画視聴ページを 自由に御切り替えいただけます。 ▼【対象ユーザー】 一部のプレミアム会員ユーザー （対象ユーザーは順次増加し、
仕様やUI(画面)は現行バージョンと異なる可能性があります。 Cacooの最新版についてはこちらからご確認ください。 こんにちは、Cacooプロジェクトマネージャの平山です。今回は、Cacoo開発チームが現在注力していること、近い将来Cacooにもたらされる大きな変化について皆様に報告したいと思います。 2009年にCacooが生まれてから約7年間、僕たちはCacooの編集画面にFlashという技術を使ってきました。 FlashはWeb上で高度な表現を、環境に左右されることが少なく実現できる技術として、CacooのようなリッチなUIを備えたアプリケーションやエンターテイメントに長い間利用されてきました。しかし昨今ではFlashの抱える脆弱性によるセキュリティ面での懸念が指摘されることも多く、Flashが利用できない、あるいは利用しづらい環境も見られるようになりました。一方でWebの標準的な
Updated 2014.02.16 / Published 2014.02.16 jQueryでdata-*属性を扱う際にjQuery.data()メソッドもしくはjQuery.attr()メソッドを使うことになるでしょうが、jQueryで扱えるdata-*属性のオブジェクトは前提としてキャッシュ仕様であることを理解しておかないと嵌ることが多々あります。 取得だけなら問題は起こらない <div id="user1" data-id="1" data-user="Jack" data-date-of-birth="2000-10-01">Jack</div> これらのdata-*属性を取得したい場合、jQueryであれば次のように記述します。 //data()の場合 jQuery("#user1").data("id"); // => 1 (数字扱い) jQuery("#user1").d
ワウペダルが好きです。ギターのカッティングにかけて遊んでいるとあっというまに時間が過ぎていきます。そんなわけでどこのご家庭にもあるiPhoneとJavaScriptでワウペダルを作ることにしました。こんなやつ。 JavaScriptでiPhoneの加速度センサーとWeb Audio APIを使ったワウペダル作った。 http://t.co/rGDHh5FaWb https://t.co/erfjy9tL80— aike (@aike1000) 2014, 10月 20 ■作り方 まず、Web Audio APIでフィルターを作ります。 Biquad Filterを作ってバンドパスフィルターに設定するだけです。簡単。Qの値を少し大きめの4くらいにしておくとワウらしいクセが出ます。あとは0.0〜1.0の引数の値に応じてフィルターの中心周波数をセットする関数setWahPos()を用意しておきま
About web-mode.el is an autonomous emacs major-mode for editing web templates. HTML documents can embed parts (CSS / JavaScript) and blocks (client / server side). Support You can help web-mode.el by donating on or by sponsoring on Native Features smart indentation (according to the context : HTML, code, JavaScript or CSS) compatibility with many template engines : php, jsp, gsp (grails), asp / as
2012年 10月 9日 出ましたよ！新しくhtmlに特化したEmacsのメジャーモード。 web-mode.el htmlにごちゃごちゃ書き過ぎるのはあれですが、html中のCSS,PHP,JavaScript,Java/JSP,ASPXを色分け出来きて、インデントを統一できるのは便利です。 PHPフレームワークのテンプレートなどに有用ですね。 良いなと思った機能 web-mode-toggle-folding "C-c C-f" HTMLタグを折り畳む機能です。カーソルの位置のタグ内が省略されアンダーラインでマークされます。戻すときも"C-c C-f"です。 web-mode-rename-element "C-c C-r" タグの開始タグと終了タグの名前を変えてくれます。 web-mode-match-tag "C-c C-n" タグの開始タグと終了タグにカーソルを持っていってくれま
html5でも正しくインデントしてくれるweb-modeを導入してみた
以前にhtml5を書くためにnxml-modeを導入したが、これはどちらかというとxhtml5を書くためのものでinputタグ等は最後にスラッシュを書いてタグを閉じておかないとインデントが残念なことになってしまっていた。 最近はhtml5で書いた(しかも、微妙にxhtmlの記述が混ざっていたりする)ファイルを扱う事が多くなってくると、インデントがうまく処理できないnxml-modeだと使いにくいので、web-modeをインストールして使用してみた。 インストールweb-mode.elのページからweb-mode.eをダウンロードして適当なディレクトリに置く。 .emacsの設定.emacsに下記の記述を追加 (setq auto-mode-alist (append '( ("\\.\\(html\\|xhtml\\|shtml\\|tpl\\)\\'" . web-mode) ("\\.
2-1. リサイズ処理 Figure 2. Mobile Safariによる画像アップロード画面 最終成果の画像データを、サーバーサイドAPIにPOSTすることがゴールである。Androidにおいて、XMLHttpRequestでBlobをリクエストに設定しても空のボディで送信される問題がみられるため、今回はBase64 encoded DataURIとしてPOSTすることにしている。 2-1-1. 基本実装 ƒ 今回のリサイズ処理では、Canvas要素とFile APIを利用する。基本方針としては、inputtype='file'のchangeイベントから、Fileオブジェクトを取得し、それを一度Canvasに書き出すことでリサイズを試みる。最終的には、canvas.toDataURL() によってDataURIを取得する。 下記に、基本実装のサンプルを示す。( http://co
思うところがあったのでマークアップを変更していた。「背景画像として表示されるべきではないものを背景画像として表示しているのは良くないのではないか？」みたいな夢を見た後、じゃあ「まず変えてみよう！」みたいな。なんか変だなと思ったらF5すれば直る(はず)。 ロゴをh1でマークアップしてたのをやめ、aまたはmarkとimg要素でマークアップするようにした 代わりにそれぞれのページにふさわしい見出しをちゃんと付けた でもその見出しをdisplay: noneしててひどい main要素さん、こんにちは！ h2で始まっていたコンテンツ部分の見出しレベルを一段階繰り上げた ロゴは見出しなのどうなのみたいなのは深く考えると眠れなくなるので、あんまり考えない方が良い。変えたのはロゴは画像で背景じゃないのでimg要素使うようにしたかったみたいなのがあって、ついでにページの見出しちゃんと書くかと考え、ロゴに見出
今回のGDCで任天堂は2つの開発者向けセッションを予定。最初に行われたのは「Nintendo Wii U Application Development with HTML and JavaScript」(HTMLとJavaScriptを使ったWii Uアプリケーション開発)と題したセッション。講師は任天堂の環境制作部の島田健嗣氏です。 Wii Uの最大の特徴であるWii U GamePadは、手元にある第2のスクリーンとして、テレビ画面と連携することによって、多くの人々と体験を共有しながら、操作性の良さを同時に実現することができます。任天堂は昨年末の発売から、ゲームソフトだけでなく、『YouTube』や『ニコニコ動画』、あるいは『Wii Street U』といったアプリケーションをリリースしてきました。これらは元々、ウェブサービスとして提供されているものですが、リビングでの体験へと変化
モバイルHTMLシリーズ HTML5で追加されたinput要素のタイプはiPhone、Androidでどのくらい使えるのか おすすめ iPhone、Androidで使える！撮ったその場で画像編集できるHTML5アプリを作ってみよう iOS6のSafariでサポートされるHTML5の機能 HTML5で使えるスマートフォンの機能 スマートフォンサイトのパフォーマンスチューニング スマートフォンサイト用の軽量ライブラリ QUOjs HTML5のWebアプリで使えるジェスチャーにはどんなものがあるのか調べていたら、QUOjsというライブラリを見つけたので試してみました。 サイズが16KBと軽量なライブラリですが、簡単にイベント処理を実装できるので便利です。今回使ったバージョンは2.2.0 になります。 以下のサイトからダウンロードできます。 QuoJS 英語ですが以下のページに使い方が書いてあり
藤川真一（えふしん） FA装置メーカー、Web制作のベンチャーを経て、2006年にpaperboy&co.へ。ショッピングモールサービスにプロデューサーとして携わるかたわら、2007年からモバイル端末向けのTwitterウェブサービス型クライアント『モバツイ』の開発・運営を個人で開始。2010年、想創社（現・マインドスコープ）を設立。2012年4月30日まで代表取締役社長を務める Facebookが、HTML5をベースにしたアプリから、ネイティブアプリに舵を切った時に、「HTML5に賭けたのは失敗」という話が業界を駆け巡った。 それまでHTML5は、新しいWeb技術の希望の星のように言われており、将来を渇望されていたところに水を差された形になった。 そこで、改めて冷静に「HTMLとは何なのか？」ということを考え直してみた方が良いと思う。 HTMLとWebブラウザの技術的メリットは、 画像な
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
