テキスト選択後のアクションをポップアップしてくれユーザビリティ向上に使える「Search And Share」:phpspot開発日誌
テキスト選択後のアクションをポップアップしてくれユーザビリティ向上に使える「Search And Share」 2009年12月25日- テキスト選択後のアクションをポップアップしてくれユーザビリティ向上に使える「Search And Share」。 ページ内のテキストを選択するとポップアップメニューが出てクリックで任意のページを開くなどのアクションが設定できます。 動作を説明すると、まず、ページ内のテキストを選択します。 すると、ポップアップが現れて、コピーの他、各種検索サイトに誘導させることができます。 拡大すると以下のような感じです。 ブラウザのコンテキストメニュー拡張みたいですが、これならどんなブラウザでも同じものを見せられます。サイトの内容によっては大きくユーザビリティを上げられそうです。 で、クリックすると、ここからが面白くて、ページの上部からIFRAMEが現れてアニメーション
そのまま編集が可能なテーブル実装用jQueryプラグイン「Zentable」:phpspot開発日誌
そのまま編集が可能なテーブル実装用jQueryプラグイン「Zentable」。 次のように、クリックでその場で編集できるテーブル実装用のjQueryプラグインです。 以下のような特徴があるようです。 ajaxによるデータ読み込み マウスホイールやキーボードによる操作 カラムやテーブルのリサイズ機能 並び替え、フィルタ機能付き ツールチップ機能付き コンテンツにHTMLを入れることも可能 CSSによるテーマデザインが可能 以下のエントリを参照してください。 Zentense: Zentable 関連エントリ スクロール可能なテーブルを作成するJavaScriptライブラリ「ScrollableTable」 わずか2.5KBでテーブルにソート機能を提供する「TinyTable」 テーブルの列でソートするJavaScriptライブラリ
複雑な数式を出力したい際に使えるjQueryプラグイン「jsLaTeX」:phpspot開発日誌
複雑な数式を出力したい際に使えるjQueryプラグイン「jsLaTeX」。 <div class="latex"> int_{0}^{pi}frac{x^{4}left(1-xright)^{4}}{1+x^{2}}dx =frac{22}{7}-pi </div> のようなブロックがあったとします。 で、次のJavaScripコードを書くと数式として表示できます。 <script> $(".latex").latex(); </script> LaTeXの表記で書けば画像にしてくれるようです。 JavaScript で描いているわけではなく、バックエンドの画像にリクエストして出力しているだけですが、その分画像も綺麗に出力されてます。 以下のエントリを参照してください。 Knowledge-aholic: jsLaTeX: A jQuery plugin to directly embed
[CSS]ハック無しで、不透明なパネルをドロップダウンするナビゲーション
IEをはじめとするクロスブラウザ対応の不透明なスタイルを適用したドロップダウン型のナビゲーションをCSSplayから紹介します。 IE6でのキャプチャ ナビゲーションはJavaScriptやtableは使用しておらず、スタイルシートもハックや条件付きコメントは使用していません。 対応ブラウザはIE5.5/6/7/8, Fx, Op, Safari(Win), Chromeとのことです。 また、同様に垂直型のナビゲーションも公開されています。
javascriptプログラマのレベル10 : tech.kayac.com - KAYAC engineers' blog
週末料理をしていて足を切ってしまいました。agoです。 以前Perlは書いていたんですが、その頃以下の記事を読んで非常に感銘を受けました。 Perlプログラマのレベル10 - Perlプログラミング救命病棟より - naoyaのはてなダイアリー 当時あまりコミュニティとのつきあいがなかったので、「自分のスキルの絶対位置」、「次のレベルへ行くために必要なもの」を知ることで非常に安心感を感じた記憶があります。 いま確認したところ、「JavaScriptプログラマのレベル10」はないようなので書いてみました。 Perlプログラマ Schemeプログラマ Rubyプログラマ （本家に直接リンクできるURLが無かったため、参照ページへリンクしています） haskellプログラマ 堕落したCプログラマ HTML知識レベル プログラマレベル 企業法務 JavaScriptの業務スキルレベル 判別表 （５
Gmailチームが明かすHTMLアプリケーション起動の高速化テクニック TechTalkManiacs
などという煽り気味なタイトルをついつけてしまいたくなる記事がGoogleCodeBlogに掲載されていました。 最初のほうはごく普通にJavaScriptを使ったRIAアプリケーションはどうしても起動が遅くなるため、それをどう減らすか、というテーマにそって書かれています。 方法として挙げられているのは、最初にすべてを読み込まず、モジュール単位で分割して遅延ローディングすること。ただし、それだけだと回線速度が遅く不安定なモバイル環境では問題が生じるためHTML5のキャッシュ機能を利用するといいとのこと。 遅延ローディングのためのさまざまな手法の得失や、例えばユーザーデータを読み込むときには動的ロードしない、というようにユーザーの操作を妨害しないよう留意することなどについても述べられていてそれだけでもノウハウとして十分に有意義なのですが、決め手として最後に出てくる方法がすごいです。 その方法と
リッチ過ぎず、どんなページにも馴染みそうなWYSIWYGエディタ実装jQueryプラグイン「wkrte」:phpspot開発日誌
リッチ過ぎず、どんなページにも馴染みそうなWYSIWYGエディタ実装jQueryプラグイン「wkrte」 2009年12月21日- リッチ過ぎず、どんなページにも馴染みそうなWYSIWYGエディタ実装jQueryプラグイン「wkrte」。 普通、JavaScript で動くWYSIWYGエディタというと、大きなツールバーがついていて、それ自体はカッコいいのですがページデザインにうまく馴染ませることが難しかったりします。 wkrte なら、エディタにカーソルがフォーカスしない状態だとツールバーを表示せず、普通のテキスト領域（textarea）のように表示させられます。 何もはいってない状態だと、一見普通のtextareaです 内容が入ってもツールバーがないので目立ちすぎず、いい感じです。 カーソルを合わせるとツールバーが表示。これはとてもスマートですね。 高機能なテキスト編集を実現しつつ、ペ
jQueryとAjaxで作るスムーズページング (1/3)
Googleの検索結果のように、長いリスト項目を複数のページに分割して表示することを「ページング」（Paging）と言います。ページング処理では下部にナビゲーションリンクを配置し、クリックされた番号のページを表示しますが、ページ全体をリロードして切り替えるには時間がかかります。そこで今回は、スムーズにページングさせるためにAjaxを利用して更新が必要な部分のみを外部ファイルから読み込んで書き換え、ユーザーのストレスを軽減する方法を紹介しましょう。 データのHTMLを用意する 今回は、数が多い商品情報のリストを複数のページに分割して表示するサンプルを作成します。はじめにAjaxで読み込むコンテンツデータを用意します。Ajaxは、XMLやJSON（JavaScript Object Notation）、テキストなどさまざまデータを扱えますが、今回はもっとも手軽なHTMLを使いましょう。コンテン
jQueryをよく使う人に使えそうな７つのチートシート:phpspot開発日誌
jQueryをよく使う人に使えそうな７つのチートシートがまとまっています。 内容が被ってしまう部分もあると思いますが、７種類の中から自分が使いやすいものを組み合わせて置いておくと便利ですね。 ajaxブームの2005年から4年。すっかりjQueryが地位を確立してしまった感がありますね。 以下のエントリを参照してください。 7 jQuery Cheatsheets For Every Designer & Developer to Have | TutZone 関連エントリ ボックス要素をレンガ状に綺麗に整列させる「jQuery Masonry」が凄い GoogleMapみたいに画像をズーム＆グリグリ移動できるjQueryプラグイン「Mapbox」 少ないスペース内でコンテンツをグリグリスクロールさせられるjQueryプラグイン「Flips」 jQuery用のGUIコンポーネントプロジェク
JavaScriptが10年ぶりのバージョンアップ、ECMAScript 5th Edition
12月15日、JavaScript、正式にはECMAScriptと呼ばれる言語の仕様策定が完了したとEcma Internationalが発表しました（ECMAScriptは、JavaScriptの基となる仕様の名称です）。 今回承認されたのはECMA-262 5th edition（ECMAScript 5th Edition）と呼ばれる仕様で、いわゆるJavaScript 2.0と呼ばれるものです。12月3日にはEcma Internationalの第98回総会において承認されていました。 （追記：ECMAScript 5th EditionがJavaScript 2.0として実装されるかどうかは不明でしたので、修正します。タイトルにも「JavaScript 2.0」が含まれていたので、タイトルも合わせて変更しました。） ECMAScriptの最新仕様は4月に最終候補が提出されており、
cssとHTMLのみで擬似的な3D表示を実現するCSS 3D Meninas - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 これ凄いです。僕が知らなかった だけかも知れませんが、この動き でjs等も使用していないのは驚き でした。cssとHTMLのみでマウス オーバーした際の画像に3D効果 を出しています。 動作はIE8、Firefox3、Opera9、Safari 3、Chrome4などで動作するそうです。 マウスオーバーし、左右に動かすと画像も動きます。 複数の透過レイヤーを重ねてhoverで動きを出しているみたい。何枚かの画像と下記のような画像を使ったｃｓｓスプライトを使って実現しているようです。 この効果はmootoolsやjQueryのプラグイン(mParallaxやjParallax)を使えば同じ表現を実現出来ます。 実用性は期待できませんが、cssとHTMLだけっていうのが
[JS]jQueryのプラグイン100選 -2009年総集編
2009年に紹介したものを中心としたjQueryのプラグイン100選です。 カルーセル・ニュースティッカー関連 ギャラリー・画像拡大関連 ナビゲーション関連 タブ関連 パネル・ボックス関連 角丸関連
またまた登場！凄くリッチなWEBアプリ作成フレームワーク「Ajax.org Platform」:phpspot開発日誌
またまた登場！凄くリッチなWEBアプリ作成フレームワーク「Ajax.org Platform」 2009年12月16日- またまた登場！凄くリッチなWEBアプリ作成フレームワーク「Ajax.org Platform」。 Ext.js ばりにきれいなUIと多機能さで今後が期待されるJSフレームワークです。 次のような綺麗でリッチなインターネットアプリケーションが作れます。 デモページには多数のコンポーネントが掲載されていて色々できることがわかります。 GoogleMapや、各種UIパーツの他、３Dグラフなんかも面白いです。 JavaScript でクネクネ動く3Dグラフです。 以下のページを参照してください。 Ajax.org - The real-time collaborative application platform
Onixslot88: Situs Judi Slot Online Terbaru RTP Gacor Hari ini Resmi 2024
Salah satu aspek yang membuat Onixslot88 unggul adalah tingkat RTP (Return to Player) yang gacor. Tingkat RTP yang tinggi menjadi daya tarik utama bagi para pemain yang mencari peluang besar untuk meraih kemenangan. Dengan menawarkan persentase kembalian yang lebih tinggi, Onixslot88 memberikan keuntungan tambahan kepada para pemainnya, menciptakan lingkungan di mana peluang besar menanti. Keamana
速くてコンパクトな JavaScript 用の sprintf の実装 - latest log
[javascript][sprintf] で検索してたどり着く方が多いようなので、uupaa-0.7.js から切り出して張ってみます。 /*!{id:"uupaa.js",ver:0.7,license:"MIT",author:"uupaa.js@gmail.com"}*/ window.sprintf || (function() { var _BITS = { i: 0x8011, d: 0x8011, u: 0x8021, o: 0x8161, x: 0x8261, X: 0x9261, f: 0x92, c: 0x2800, s: 0x84 }, _PARSE = /%(?:(\d+)\$)?(#|0)?(\d+)?(?:\.(\d+))?(l)?([%iduoxXfcs])/g; window.sprintf = _sprintf; function _sprintf(fo
JavaScriptのswitch文の速度はブラウザの違いでこんなにも差があった。 - 風と宇宙とプログラム
はじめに JavaScriptのswitch文は、CやJavaと異なりcaseのところに任意の式が書けるため、実行時にcaseの式も評価されるので基本的にはif-else文の並びと類似のものになります。つまり、caseの数に応じてパフォーマンスも低下すると予想されます。本当にそうなのか確認してみました。 測定した各ブラウザのバージョンは以下の通りです。 Firefox Chrome Safari Opera IE 3.5.6 4.0.249.30 4.0.4 (531.21.10) 10.10 8.0.6001 caseが数値リテラルの場合 パフォーマンスを測定するテストコードは下記のような簡単なものです。caseが1000個あるswitch文を10万回繰り返して実行したときの時間を測定しました。perf_test()関数の引数ｖに与える値に応じてcaseの条件で一致する場所が変わります。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CoffeeScript
Loading...
Site Under Maintenance
jQueryサンプル集 | DesignWalker
