JavaScriptで遅延ロードをする方法についてのおさらい
先日リリースした Extractor の Bookmarklet(コメントをチェック(浮き出る版))のデザインや仕様を変えました。主な変更点としては、「マウスでドラッグできる機能」が付いたのとデザインをがらっと変えました。 その際にma.laさんの最速インターフェース研究会で紹介されていたJavaScriptでの遅延ロードのテクニックを拝借させて頂きましたので、覚え書きのつもりで今回どのようにしてそれを使ったのかについて書いておきます。 まず、先に紹介した Extractor の Bookmarklet がなにをやっているかというと、現在見ているページに script タグのエレメントを生成して、他のドメインのJavaScriptのソースを読み込んでいます。Bookmarklet を分解すると下記になっています。具体的には createElement で script タグを生成して、各プ
GIGAZINE - ファイルサイズわずか3KBのオーバーレイ効果「Litebox」登場
オーバーレイ効果を作り出す「Lightbox」というスクリプトの超軽量版です。 実際の例やダウンロードは以下から。 Litebox- Same great taste, less calories http://www.doknowevil.net/litebox/ 上記ページの画像をクリックするとどういう効果なのかがよく分かります。 Liteboxで使われているのがこの「moo.fx」という軽量なJavaScriptエフェクトライブラリ。 moo.fx - the next small thing http://moofx.mad4milk.net/ また、類似品としてはこんなのもあります。 GIGAZINE - オーバーレイ効果を作り出す軽量スクリプト「iBox」
Google Calendar の使い方 | グーグル・カレンダーの便利な機能や特徴を紹介します
ネットで検索してたら、ルシアクリニックの京都駅前院がめっちゃ気になるなぁ。 医療脱毛なのにすごい安くていい評判も聞くけど、ほんとに痛くないのかな？ 通っている人の口コミをみてみたいなぁー。 なんて気になったので、ルシアクリニックの京都駅前院についてSNSやネットで調べてみました。 そう思ってSNSを中心に調べてみたら、、、口コミや評判も良いじゃない♪ ちなみに、似たようなサービスや商品があるかも？なので、今回調べてみたのはこちらになります。 オープンしました！ ルシアクリニックの京都駅前院ですが、すでにオープンしています！（2020年8月20日オープン済） もちろんですが、オープンしたてなんでめっちゃ予約が取りやすいです。 ただし！！人気のある医療脱毛院なので早めの予約が良いかも？！
Prototype.js を使った JavaScript OOP 講座 #01
社内の精鋭エンジニアを中心に定期的に勉強会をすることになった。んで、 JavaScript の講義は僕がやることになった。 資料を社内だけでとどめておくのはもったいないので、ここに公開していきます。社内の人も社外の人も読んでください。 講義の内容は基本的にソース嫁。ソースレビュー形式。 ※ターゲットは JavaScript は書いたことない、オブジェクト指向言語プログラマ。 Section 00 Prototype.js の前に JavaScript のオブジェクトの概要・・・ オブジェクトを作ってみる。 var object = {};オブジェクトにメソッドとかプロパティを追加してみる。 var object = { field: 'IT戦士', method: function() { alert('hello ' + this.field); } }; object.method()
PHPとAjaxでクールなRatingバーを使う:phpspot開発日誌
AJAX_RATING 特定のコンテンツを、訪問者に評価してもらう仕組みを実装している場合、どのように実装しているでしょうか？ AJAX_RATINGを使えば、直感的に分かりやすいインタフェースかつ、少ない操作でレーティングの機能をサイトに実装することが出来ます。 表示イメージは次のような感じで、１クリックで１０段階評価が可能。クリックするとページ遷移なしに即座にレーティングが再計算されます。 かなりお手軽なので、これまで見た評価システムよりも優秀だと感じました。 ちなみに画像ファイルは分かれているので自由にイメージは変えられるようです。 これは使えますね。
AjaxでRSS/OPMLを読み込んでページに表示するツール:phpspot開発日誌
OPod The OPML-Pod is an AJAX OPML and RSS viewer widget that you can embed in any web page you like. OPodはRSS/OPMLを自分のページに簡単に貼り付けることが出来るJavascriptで出来たウィジェットです こんなウィジェットをページに表示できます。 RSSだけでなく、OPMLも取り込めるのが新しいですね。OPMLのカテゴリをクリックするとグリグリ動いてくれます。 OPMLとはお気に入りを標準化したもので、RSSリーダーのお気に入りFeedの一覧を保存しておくのによく使われるXMLフォーマットです。
suggest.js - 入力補完ライブラリ
Japanese / English JavaScriptで入力補完を手軽に行うためのライブラリです。 (【お知らせ】ver2.0からprototype.jsを必要としなくなりました) 下記のような機能を持っています。 入力内容をもとに検索を行い、補完候補を表示します。(Google Suggestぽく) Ajaxでは無く、初回画面表示時のみデータの読み込みを行い、それ以降は、クライアント側で対象データから検索します。したがって、入力内容に変化があってもサーバ側にアクセスすることはありません。 検索は、前方一致/部分一致、大文字と小文字の区別あり/なしといったように、オプションで簡単に指定できます。また、その他にも様々なオプションが指定可能です。 検索結果の表示上限を指定できます。(デフォルト上限20件) 補完候補はキーボードの上下と、マウスにて選択できます。また、キーボードで選択中にES
2006年のAjaxはJavaScriptプログラミングが脇役になっていく：Randomwalk：オルタナティブ・ブログ
このところAjax系の話題が続いていてAjaxブログっぽくなっていますが、私がAjaxに注目している理由は、AjaxがWeb2.0の文脈で大事なテクノロジであると同時に、業務アプリケーションをWeb化するツール、言い換えるとリッチクライアントの技術としてもAjaxは大きな位置を占めそうだ、という2つの側面があるからなんですね。後者のほうが＠ITぽいですけれど、それはさておき。 これまでのエントリに対してコメントやトラックバックをいただいてありがとうございます。どれも目を通しています。 さて、いただいたいくつかのコメントで「ベンダはバックエンド向けの製品へ投資をシフトさせているし、フロントエンド系はオープンソースで作れるようになってきているので、フロントエンド向けのツールでのメッセージが少ないのでは」というご意見をいただきました。私もそうだとは思うのですが、お金や手間を掛けないなりにも、Aj
Ajax を使ったマウスジェスチャ認証
Ajax を使ったマウスジェスチャ認証 2005-12-26-1: [Ajax][JavaScript] - Using AJAX for Image Passwords http://waelchatila.com/2005/09/18/1127075317148.html Recode に書いた文字がそのまま認証になる． 認証するときは，Login にその文字を書く． 結構精度がいいので，なかなかログインできないときも．
JavaScriptとDHTMLによるタイピングゲームの作成：CodeZine
完成版のアプレットで遊ぶ はじめに JavaScriptやJava言語で製作されたアプレットによる、ブラウザ上で動作するゲームを、90年代後半からインターネット上で数多く見かけるようになりました。これらのゲームは、特別なアプリケーションをインストールすることなく、Microsoft Internet ExplorerやNetscape Navigatorなどのブラウザ上で実行することができ、クロスプラットフォームで動作するため、一時期ホビーストたちの間で脚光を浴びました。また、Internet Explorer 4.0以降はDynamic HTML（以降「DHTML」と表記）が登場し、スクリプトからHTMLドキュメントを動的に変更することもできるようになりました。 しかし、ブラウザ上で動作するスクリプトプログラムには、さまざまな制限があります。実際に、インターネット上で見ることができる多く
伊藤直也の「アルファギークのブックマーク」 - Ajax、Ruby on Rails、Web 2.0。2005年を彩ったWebテクノロジー
時間が経つのは早いもので、2005年ももうまもなく終わりです。Webの世界でも、今年1年を振り返るためのさまざまなニュース、記事が発表されています。これに便乗しつつ、ギークの視点かつ新しいWebテクノロジーの切り口で、2005年を自分なりに振り返ってみたいと思います。 さて、2005年のWebテクノロジーの世界でもっとも際だった3つの言葉として私が挙げる物は、おそらく多くのギークな人たちと同様、「Ajax」「Ruby on Rails」「Web 2.0」の3つです。 ■ JavaScriptに光を当てたAjaxという方法論 AjaxはJavaScriptを利用した動的ロードテクニックの総称で、「Google Maps」などが見せた、新しいWebアプリケーションの可能性を切り開く方法の1つです。Ajaxの功績は、そのテクニックを利用した斬新なWebインターフェイスの表現方法を世の中に示したこ
fladdict.net blog: AJAXの裏の意味
2ch、ajaxスレより引用 536 ：デフォルトの名無しさん ：2005/08/28(日) 09:39:45 >>534 > にしても何故 Ajax なんだろう。 Ajaxっていう結構メジャーな洗剤があって、これとSOAPを掛けてるらしい。 同名の洗剤があるのは知ってたけど、SOAPを意識したネタだって説は今まで微塵も考えなかった。 投稿者 Taka : 2005年12月23日 02:29 book bookmark はてなブックマークに追加 del.icio.usに追加 trackbacks this entry's trackback URL: http://www.fladdict.net/cgi-bin/mt3/mt-tb.cgi/427 このリストは、次のエントリーを参照しています: AJAXの裏の意味: » http://autofordpart-lyoQ.blogspot.
Ajax ジェスチャー認証 | 秋元@サイボウズラボ・プログラマー・ブログ
via Ajaxian ジェスチャーによる認証のアイデア自体はそれほど新しいものではないと思うが、Ajax でジェスチャー認証はけっこう面白いのではないか。 デモの使い方を説明する。 文中中央下の二つのボックス、左の “Record” ボックス内でマウス左ボタンを押しながら、自分のジェスチャーを記憶させる。 続いて、右の “Login” ボックスでマウス左ボタンを押しながら、自分のジェスチャーを伝える。 右で入力したジェスチャーが、左で保存していたジェスチャーと合致したら、ログイン成功となる。何回かやってみたが、それなりに似たジェスチャーを再現しないとログイン成功にはならない。 マウスで描いた軌跡で認証、というのは、サインの国の人らしい発想ではあると思った。 Ajaxian では、他にも同じブログから、写真に写された「概念」をヒントにクリックさせることでスパムロボットを振り落とすアイデアも
作って理解するAjax (1)：IT Pro
最近，Webエンジニアのまわりで注目されている技術に「Ajax」(エイジャックス)があります。従来のWebアプリケーションはインタラクティブな処理の際，ユーザーにページのリロード作業を強いることが多く，決して操作性が良いとは言えませんでした。しかしAjaxを利用すると，サーバーと非同期な通信ができるので，ページをリロードすることなくコンテンツを更新できます。このためデスクトップ・アプリケーションと同様な操作性を持つWebアプリケーションを作成できます。本連載では，実際にAjaxアプリケーションを開発しながら，Ajaxアプリケーションの動作の仕組みや，既存のWebアプリケーションとの違い，実装上の注意点などについて紹介していきます。 「枯れた技術」を組み合わせる 筆者にとってAjaxの第一印象は強烈でした。「Google Map」のスムーズな地図操作，「Google Suggest」のリアル
Ajaxを勉強しよう
このページはAjaxを勉強してみたい人向けの学習用ページです。サーバーを入れ替えたため一部CGIを使用したものが動作していません。時間のある時に修正します。また、書いてから、かなり時間が経過しているため内容的に古いものもあります。ご了承ください。 Ajaxで利用されるエフェクトに関しては別ページ(Ajax Effect)に移動しました。 Ajax関連書籍に関してはAjax関連書籍一覧ページを用意しました。 Prototype系ライブラリ サンプルプログラム【New !!】のページを用意しましたので、Prototype系のライブラリを利用している方は参考にしてみてください。 ミスや間違いなどがありましたらopenspc@po.shiojiri.ne.jpまでお願いします。 第一章 Ajaxって？ AjaxとRIA AjaxとDHTML AjaxとFlash Ajaxに必要な知識と技術 Aja
[javascript] ページ内リンクでスムーススクロール @ ZEROBASE CAST
2009/04/28：すみません、スクリプトをメンテナンスしていないため、掲載を止めました。内容や動作の保証はできませんが、別のサイトを推薦しておきます：class指定もいらない超お手軽スムーズスクロール [Javascript,jQuery] - BlurBlue-Note →zerobase.jpのajax関連情報はこちら →当時エントリへのはてなブックマーク （掲載当時の文章を念のため載せておきます） 「ページ内リンクでスムーススクロール」するためのJavaScriptコードを配布します。ページ内リンクを使う際に、このスクリプトもあわせて使えば、訪問者に親切かもしれません。 意図 派手なエフェクトを取り入れたい。ではなくて、ページ内リンクをクリックすると、一瞬でワープするので、迷子になってしまう場合がある。それを解決する手段。 特徴 HTMLを書く際に一切意識しなくて良い。あとから
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://labs.cybozu.co.jp/blog/kazuho/archives/2007/02/keeping_comet_alive.php
Ajax入門 | Ajax入門：基本サイトのリンク集
Femo (beta)
Ajax+PHPなチャット: Shoutbox:phpspot開発日誌