dynamis (でゅなみす/レッサーパンダ) @dynamitter Web開発者の皆様へ。変数名にclass, enum, export, extends, import, superを使ってないか注意してください。Firefox 5ではstrict mode外でも予約語扱いになります http://bit.ly/lInGNP 2011-06-02 14:00:27

heatmap.js | HTML5 Canvas Heatmap Library ヒートマップが描画できるHTML5 canvasベースのJSライブラリ「heatmap.js」。 ユーザのマウス位置をヒートマップという形で表示してサイトの利用方法を解析する方法がありますが、そのヒートマップを描画できるライブラリが公開されています。 取得されたデータを元にヒートマップを描画できるのは当然ながら、マウスを動かしてリアルタイムにブラウザに描画されるデモも一見の価値があります サイト上の以下のボタンを押しましょう。 リアルタイムでヒートマップが描画されます。Chromeだととってもなめらか アクセス解析的な利用はモチロンのこと、何か他のものにも使ってみると面白い効果が得られたりするのかも。 関連エントリ クリック位置のヒートマップを作成できるオープンソースやサービス色々
水平方向に長いコンテンツをスムーズなアニメーションで横スクロールさせるjQueryのプラグインを紹介します。 X-Rhyme.js [ad#ad-2] デモページが少し分かりにくいのですが、左に配置された四つの矩形がナビゲーションで、そこをクリックすると、コンテンツを横スクロールで表示します。 デモページ:「Work」をクリックしたキャプチャ 横スクロールの操作は、マウスホイールにも対応しています。 JavaSciprt スクリプトのオプションでは、ナビゲーションのセレクタ、スクロール時のスピード・アニメーションを変更することができます。 $('.horizontal_items_container').xrhyme({ navigationSelector : '.anchor a', anchorMode : true, wheelSpeed : 0.7, animationTime
ボタン等を光らせて目立たせ、分り易くすることが出来るjQueryプラグイン「jQuery illuminate」 2011年06月02日- jQuery illuminate - Tony Lea ボタン等を光らせて目立たせ、分り易くすることが出来るjQueryプラグイン「jQuery illuminate」。 あんまりギラギラするのはチカチカしてうっとうしいものになってしまいそうですが、このプラグインで実装すれば、まるでイルミネーションのように穏やかに光らせられるので、注目を集めたいような部分に適用すると使い勝手の向上につながるのかも。 動作ムービーは以下を参照してみてください。実際にブラウザで見てみたい方はサイトにアクセスしてみましょう。 このエフェクトが、必要ライブラリを読み込んだ後、$('#button').illuminate(); だけで出来ちゃいます。 オプションで強さや、ス
Forms -フォーム [ad#ad-2] Skeletonの特徴 スマフォ対応のグリッド Skeltonでは軽量の960pxのグリッドシステムを採用しています。 ブラウザやタブレット、スマートフォンなどスクリーンのサイズが小さくなると、そのサイズに最適なレイアウトに変更します。 Fast to Start 洗練されたベーシックなUIエレメントをあらかじめ用意してあるので、すばやくサイトの制作が始められます。 Style Agnostic SkeltonはUIのフレームワークではありません。最もベーシックなスタイルを提供していますが、あなたの好きなデザインを適用することができる開発キットです。 Skeltonの対応ブラウザ・デバイス Latest Chrome (Mac/PC) Firefox 4.0, 3.6, 3.5, 3.0 (Mac/PC) Latest Safari IE9, I
HTML5でブラウザにドラッグ&ドロップでファイルアップ可能なjQueryプラグイン「jQuery HTML5 Uploader」 2011年05月26日- jQuery HTML5 Uploader HTML5でブラウザにドラッグ&ドロップでファイルアップ可能なjQueryプラグイン「jQuery HTML5 Uploader」。 デスクトップからブラウザにドラッグ&ドロップできたら、初心者の人とかはもっとアップロードが簡単になるはずですね。 HTML5を使って実装されていて、そのUIなんかも面白いUIで提供されていたのでご紹介。当然ダウンロードして使うことができます。 ファイルを画面の割れ目の穴にドロップしましょう。複数ファイルもOKみたい。 なんと、すぐ下にイメージが表示されてアップ開始。進捗表示もできます。 こんなことが出来るんだというのを知っておくだけでもよさそうですが、jQue
複雑なデータ構造のJSONを扱う際にCSSセレクタ風にアクセスできて超便利な「JSONSelect」 2011年05月25日- JSONSelect 複雑なデータ構造のJSONを扱う際にCSSセレクタ風にアクセスできて超便利な「JSONSelect」 jQuery成功の背景には、そのDOMへのアクセスのしやすさがひとつの要因だと思いますが、JSONSelectを使うと、JSONデータへのアクセスをCSSセレクタっぽく、jQueryっぽく簡単にアクセスできます。 例えば、次のようなJSONデータがあったとしましょう。 JSONSelectで、「.languagesSpoken .language」として選択すると、次のように要素を選択できます。 例えば、検索結果などで、同じ構造の要素がリストとして帰ってくるようなケースにおいて、同じ名前の属性リストをサクッと取得可能。 上位階層が指定できるた
すこし前の話になりますが、Titaniumを使ってiPhoneアプリとAndroidアプリを同時リリースしました。iPhoneアプリの方は、以前公開した暗黒ノウハウでわりと楽に作れました。問題は、Android。iPhoneとは違う暗黒ノウハウが必要となりました。 Titanium Mobileの暗黒ノウハウを公開します。 - このブログは証明できない。 今回は、ボリューム少なめです。もう少したまってから公開しようと思ったのですが、Objective-Cを使った開発に戻ったので、しばらくTitaniumは使わないだろうということで公開することにしました。そうそう、日本語でTitaniumの書籍が出るみたいですね。 Android対応 TitaniumはiPhone対応が先行していて、Androidだと機能がなかったりバグがあったりするそうです。私はわりとどうでもいいアプリしか作ってないので
Ninja UI 独特のUIを提供してくれるjQuery用のUIフレームワーク「Ninja UI」 アイコンや、ボタン、ポップアップ、レーティング、スライダーといった各種UIを提供してくれます。 UIは独特のデザインですが、それなりに汎用的に使えそうなものになっています。 他と同じUIは嫌だ、という方は使ってみるのもよいかもしれません。 関連エントリ jQuery UI のアイコンチートシート レイアウトをユーザの手によってデスクトップアプリ風に調整可能にするjQuery「UI.Layout」プラグイン selectボックス利用時に選択肢を複数選べるUIを提供してくれるjQueryプラグイン「selectList」
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 簡単なものですけど、jQuery Mobile でのマークアップ時によく使うっぽい UIのサンプル作ったので配布します。 簡単なチートシート代わりになるのでは 無いかと思ったのでシェアしてみよう かと。良かったら使ってください。 というのも、JQMの日本語サンプルの配布先を見かけなかったので、なかなかお困りの方もいらっしゃるんじゃないかなと。調べるの面倒ですし、手元にサンプルコードあったほうが何かと便利ですよね。 というわけで、以前マークアップサンプルの記事書いたときに作ったサンプルサイトに手を加えた物を丸ごと配布します。 流石にかなり出てるので今更説明不要かもですけど、ざっくり説明するとWebサイトをスマフォ向けに簡単に出来るjQueryプラグインです。 以下のサ
背景画像に更にドットパターンを合成して超カッコよくできるjQueryプラグイン「Vegas Background」 2011年05月19日- Documentation: Overlay - Vegas Background jQuery Plugin 背景画像に更にドットパターンを合成して超カッコよくできるjQueryプラグイン「Vegas Background」。 背景画像を大きくサイトに使う場合に、単に写真を使ってもカッコイイのですが、ドットパターンを合成してよりカッコよくすることが出来ます。 その昔、Photoshopで画像にテレビに写ったような走査線を入れるようなプラグインが流行ったりしましたが、そういう処理は今やjQueryでやる時代のようです。 大きい写真を背景に使ったデザイン。 画像が小さくてもブラウザサイズに応じて引き伸ばしてくれる機能もついてます。 拡大してみると、まぁ
JavaScriptを使いこなそう(2) こんにちは、さち です! 前回は JavaScript の勉強に役立つサイトを紹介しましたが 今回は実際に JavaScript で cookie を扱う方法をご紹介。 cookie を扱うプログラムをゼロから作ると大変ですが jQuery.js(Ajaxライブラリ) を使えば簡単に実装できます。 「jquery.cookie.js」を使う JavaScript で cookie を扱うには別途 cookie 用のライブラリを用意します。 様々なライブラリがありますが、今回は「jquery.cookie.js」を使います。 jquery.cookie.js は単独で使用しても動きません。 名前から分かるとおり「jQuery.js」が必要です。 「jQuery.js + jquery.cookie.js」の組み合わせではじめて使えます。 ライブラリを
IEにも対応!ブラウザ上でローカルにストレージを作るJavaScriptライブラリ「jStorage」 2010年05月25日- jStorage - simple JavaScript plugin to store data locally IEにも対応!ブラウザ上でローカルにストレージを作るJavaScriptライブラリ「jStorage」。 基本はHTML5のストレージを使いますが、対応していないブラウザは、例えばIEではuserDataを使ってデータを格納します。 ライブラリ内でクロスブラウザ対応はしてくれるので、利用者はただ jStorageのメソッドを呼び出すだけでストレージを利用できます。 ブラウザごとのサポートと、ストレージサイズは以下。IE6,7 が 128KBと、比較的小さいですが、それなりに大きなデータを保持できることが分かります。 基本とするフレームワークライブラ
いま注目されているサーバサイドJavaScriptの火付け役となったNode.js。その開発者であるライアン・ダール(Ryan Dahl)氏自身がNode.jsを紹介した講演「Introduction to Node.js with Ryan Dahl 」のビデオが公開されています。 この講演は、サンフランシスコのPHP開発者の集まりであるThe SF PHP Meetup Groupが2月にダール氏を招待して行われたもの。 そのため、Node.jsを知らないデベロッパーに向けて、Node.jsがどのような特徴を持つプログラミング言語なのか、分かりやすく解説しています。内容を紹介しましょう。 Node.jsとPHPとの本質的な違いとは何か Node.jsを触ってみよう。今日は特にスライドは用意してなくて、タイプしてどんなものかを動かしながら紹介していくつもりだ(注:ダール氏はここで最初に「
今回もあまりがっつり書ける時間が無いので、超小技のエントリー( ̄▽ ̄;) たとえば、Yahooさんとかがやっているんですが、 「ページを読込んだときに、URLバーが引っ込む」という、ちょっとした気配りの動き。 Yahoo! JAPAN (スマートフォンサイト) (Yahooさんの手法とは違うかもしれませんが) その方法を紹介します。 僕の場合は、ページ読込みが完了した時に1ピクセルだけスクロールさせています。 そもそも、iOSのSafariやAndroidの「ブラウザ」は、 ページ読み込み完了時に、スクロール位置が1ピクセル以上あった場合、 URLバーが引っ込む仕様のようです。 (あくまで推測。ページ内リンクなどで、そうなるのが根拠です。) まぁ、これのなにがいいのかというと、 ページの表示範囲を少し広く見せられる。 ってところでしょうか。 やり方は簡単です。 JavaScriptでWin
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 なかなか多機能なライブラリだったので 備忘録。テーブルにソート、コンテンツの 編集や、Ajaxによる行の削除が可能な jQueryプラグイン・TableGearです。この 手のプラグインはいくつかありますが、 中でもかなり高機能な気がします。 jQueryだけでなくmootoolsも用意されてるみたいです。テーブル内でソートが可能で、セル内は編集できます。もちろん、編集後のソートもOK。行そのものを消す事も可能ですよ。 セル内は編集可能で、普段はこのように通常と変らないインターフェースを維持できます。マウスでクリックするとプルダウンや入力エリアが出現。 編集してもソート機能は維持 ソート機能が付いていますが、セル内に変更を加えても、変更後の内容でソートしてくれます。
twihelp.me 2019 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く