GmailのようにファビコンにバッジをつけられるJSプラグイン「favico.js」
2016年 1月3日 07時05分 7年前 Gmailをお使いの人ならご存知だと思いますが、 タブに目を向けるとファビコンに受信メール数が表示されていますよね。 新着メールが1件届いていれば”１”、メールが届いてなければ "0"と。 あの機能と同等のことが簡単に実現出来るJavascriptプラグインが " favico.js " です。 使い方も簡単で、わずか数行のコードで済みます！ <!-- jsファイルの読み込み --> <script src="yourPublicDir/favico.js"></script> <script type="text/javascript"> var favicon = new Favico({ animation:'slide' // アニメーションのオプション }); favicon.badge(1); // ファビコンにバッジが追加され1と表
[JS]スクリプトを指定したタイミングで読み込ませるスクリプト -Lazy Loading Script
外部スクリプトファイルを指定したタイミングで読み込ませるjQueryのプラグインを紹介します。 ちょっと前に流行った画像を遅れて読み込ませる「Lazy Load」のスクリプト版という感じです。 jQuery Lazy Loading Script – On Demand Javascript plugin Webrevised [ad#ad-2] Lazy Loading Scriptの特徴 Lazy Loading Scriptの実装 Lazy Loading Scriptの特徴 外部スクリプトファイルを指定したタイミングで即時にロードします。 ファイルが既にロード済みであれば、再びロードはしません。 必要のない時にはスクリプトを読み込まないため、ロード時間を減らします。 AJAXベースのウェブアプリケーションをよりシンプルにできます。 Lazy Loading Scriptの実装 外部
メンテナンスフリー！郵便番号から住所を返すライブラリ·ajaxzip3 MOONGIFT
Webシステムを開発している中で郵便番号を入力したら自動的に住所を補完して欲しいという要望は多々ある。実装はそれほど難しいものではない。厄介なのはメンテナンスだろう。市区町村の統廃合によってデータが変わった場合の対応だ。 郵便番号から住所に変換する便利なライブラリ 郵便局から配布されているCSVを都度取り込むという方法もあるが、非常に面倒だ。そこで使ってみたいのがajaxzip3だ。 今回紹介するオープンソース・ソフトウェアはajaxzip3、Ajaxを使って住所を取得するライブラリだ。 ajaxzip3の面白い所はライブラリをGoogle Code上にアップロードしてそのまま利用できてしまう点だ。規約上どうなのかという問題はあるが、そのまま使うと自分でメンテナンスする必要が全くなくなってしまう。自分のサーバであってもajaxzip3を外部のSubversionリポジトリからアップロードす
たった6行でWebサイトのUIをガラッと変える
「こんな長いWebページ、まったく読む気がしない」。Webサイトを閲覧していてこんな経験をしたことは誰しもあるのではないだろうか。一方で、Webサイトを作る側にとっては、どこまでを1ページにまとめるかは常に悩むところだと思う。長いからといってむやみにページが分割されているのも考えもので、今度は「次のページへ」ボタンをクリックするのが面倒になり、ストレスがたまる。 CogniTom Academic Designが作った「bookreader.js」は、そんな悩みを解決してくれるかもしれない。bookreaderは、本や雑誌をめくるような感覚で、Webページの本文を横にスクロールさせるJavaScriptライブラリだ。 「bookreader.js」のWebサイト。サイト自体がbookreader.jsを使ったデモサイトを兼ねている。中央にある [<] [>] をクリックすると1ページずつ、
胃袋ダイエットとは？ | 松本クリニック
松本クリニック院長松本浩彦は地域のかかりつけ医として、芦屋で暮らしていらっしゃる方の健康に貢献できるよう尽くしております。総合診療科として患者様を迎え入れており、疾患や年齢などに関係なくどんな患者様も診察いたします。診察の結果、より高度な専門医療が必要と判断した場合は専門医療機関を紹介いたしますので、ご安心ください。 診療科目は内科や外科をはじめ整形外科や皮膚科など多岐にわたり、さらに泌尿器科・ペインクリニックの保険診療と美容医療まで幅広くございます。患者様第一で治療方針を提案いたしますので、どなた様もお気軽にご相談ください。明るく気さくなスタッフが、丁寧に話をお伺いいたします。 また、再生医療にも力を入れており、皮膚の改善から関節の治療などあらゆる幹細胞治療をご提供可能です。 以下の症状のある方は、来院前にお電話ください。 ご来院いただく時刻を指定いたします。マスク着用の上、ご来院くださ
PHP＆MySQLのクールなAjaxノートブック構築用OSS「Surreal ToDo」:phpspot開発日誌
Get Surreal | Surreal ToDo PHP＆MySQLのクールなAjaxノートブック構築用OSS「Surreal ToDo」。 ノートはページ内にJSで追加できて、次のようにiGoogleみたいに画面一面に広がり、ドラッグ＆ドロップで移動も可能という変わったWEBツールがオープンソースで公開されています。 タブを切り替えることで多数のノートを１画面で管理することが可能です。 テキストエディタなんかを多数立ち上げている方はこれを使うと１画面に集約できてスッキリしそうです。タブが増やせるので切り替えも可能なので広く使えます 右クリックで編集やインデント、フォント設定の変更や削除が可能。 編集はダブルクリックでも出来るみたい。 左の+ボタンを押すと伸縮させることも出来ます。 関連エントリ オープンソースのソーシャルブックマーク用プログラム オープンソースGoogleAnalyt
Ajaxload - Ajax loading gif generator
Indicator type : Background color : # Transparent background Foreground color : # Create easily your own ajax loader icon : Select the type of indicator you want Enter the background code color you want (tick "Transparent background" if you don't want one Enter the foreground code color you want Press "Generate it"
[JS]JavaScript無しでも動作するダイナミックなタブコンテンツ
JavaScriptがオンだとダイナミックにコンテンツが切り替わり、JavaScriptがオフでも正常にコンテンツが表示されるタブコンテンツを実装するチュートリアルをCSS-Tricksから紹介します。 Dynamic Page / Replacing Content デモページ 上記デモではJavaSciprのオン・オフに関わらず、タブをクリックするとそれに対応したコンテンツが表示されるようになっています。 仕組みはオフ時にはタブをクリックするとページ遷移し表示され、オン時にはAJAXを使用してコンテンツを表示しています。 タブ箇所のHTMLは、下記のようになります。 HTML <textarea name="code" class="html" cols="60" rows="5"> <nav> <ul> <li><a href="index.php">Home</a></li> <l
Ajaxを使ったクールなインタフェースを持つカレンダー実装スクリプト「PHP Event Calendar」:phpspot開発日誌
Ajaxを使ったクールなインタフェースを持つカレンダー実装スクリプト「PHP Event Calendar」 2010年04月26日- PHP Event Calendar - PHP Scripts - CodeCanyon Ajaxを使ったクールなインタフェースを持つカレンダー実装スクリプト「PHP Event Calendar」というものが公開されています。 UIは次のようにクールで、画面遷移もAjaxによって行われます。 クリックするとLightBox風にイベントがポップアップします。 管理画面もいい感じで、WYSIWYGで予定を編集できます。 有償＄１４となっていますが、１から同じものを作ることを考えるとなかなか安く手に入ります。 改造もPHPなので容易ということで、似たような機能を実装したい場合においては購入してみるのもよさそうですね。 関連エントリ あなたの空き状況が一目でわ
GoogleによるAjaxアプリケーションをクロール可能にする解説:phpspot開発日誌
Making AJAX Applications Crawlable - Google Code via WebResources Depot GoogleによるAjaxアプリケーションをクロール可能にする解説サイトがあるんですね。 フルAjaxでなくとも、サイトにAjaxな仕組みを部分的にもっていて、きちんとインデックスしてもらいたいという際に知っておいて損はなさそうです。 解説によると、以下のような要約ができるみたい Ajaxコンテンツの出し分けパラメータには、#! を使う。例えば、www.example.com/ajax.html#!status こうしておくことでクローラーに対して、Ajaxのクロールが出来るよということを示しています。! がポイント _escaped_fragment_ パラメータによって、ajaxじゃなくても読めるようにしておく www.example.com/
ウノウラボ Unoh Labs: 簡単Ajaxライブラリ「jQuery」と便利なプラグインたち
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー！古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
AjaxなTODOリストをMySQL＋PHP＋jQueryで作成するデモとチュートリアル:phpspot開発日誌
AJAX-ed Todo List With PHP, MySQL & jQuery ? Tutorialzine AjaxなTODOリストをMySQL＋PHP＋jQueryで作成するデモとチュートリアルが公開されています。 プログラムのダウンロードも可能です。UIも次のようになかなかお洒落でシンプル 編集時はインラインでそのまま編集することが出来ます。 削除の際にはダイアログが次のように現れて削除の確認を行います。 なんらかのプログラムのベースとして使えそうですね。 入門としてもなかなか、やりごたえのあるチュートリアルではないでしょうか。 関連エントリ PHPとjQueryのAjax連携の学習用チュートリアル PHPによってCSSを動的に出力する初心者向けチュートリアル Ajax/CSS/PHP等のチュートリアルまとめ
AJAXサイトをクローラブルにする - 検索エンジンフレンドリーなAJAX実装方法
米Googleが、AJAXベースのウェブサイトをコンテンツを検索エンジンに登録する方法についての、最新ドキュメントを公開しました。昨年10月に検討段階の実装方法が公式サイトで紹介されましたが、それのアップデート版になります。 最初におさらいをします。AJAX（エイジャックス）は、ページ遷移なしにサーバとデータ通信を行うことで、動的なWebアプリケーションの開発が可能です。しかし、いまブラウザで表示している内容と対になるURLが存在しないために、クローラが個々のコンテンツをクロールできないこと、また、仮にステートフルURLを用意しても（クローラは）JavaScriptを実行できないためコンテンツを読み取ることができないため、検索エンジンに登録することは困難な状況でした。 しかし、Googleによると69%のウェブコンテンツがJavaScriptなどで動的に作成されているなど、近年のウェブテク
AJAXサイトをクローラブルにする - 検索エンジンフレンドリーなAJAX実装方法 ::SEM R (#SEMR)
AJAXサイトをクローラブルにする - 検索エンジンフレンドリーなAJAX実装方法 AJAXアプリ（サイト）をクローラブル（crawlable）にするための技術的アプローチ。Googleが公開した最新ドキュメントを基に解説します。 公開日時：2010年03月05日 19:53 米Googleが、AJAXベースのウェブサイトをコンテンツを検索エンジンに登録する方法についての、最新ドキュメントを公開しました。昨年10月に検討段階の実装方法が公式サイトで紹介されましたが、それのアップデート版になります。 最初におさらいをします。AJAX（エイジャックス）は、ページ遷移なしにサーバとデータ通信を行うことで、動的なWebアプリケーションの開発が可能です。しかし、いまブラウザで表示している内容と対になるURLが存在しないために、クローラが個々のコンテンツをクロールできないこと、また、仮にステートフルU
あなたの空き状況が一目でわかるカレンダー実装PHPスクリプト「Ajax Availability Calendar」:phpspot開発日誌
あなたの空き状況が一目でわかるカレンダー実装PHPスクリプト「Ajax Availability Calendar」 2010年03月04日- Ajax Availability Calendar - an Availability Calendar to show your day-to-day availability 空き状況が一目でわかるカレンダー実装PHPスクリプト「Ajax Availability Calendar」がオープンソースで公開されています。 カレンダースクリプトというと沢山ありそうですが、空き状況をとてもわかりやすく設定したり表示したりするスクリプトはあまり見たことがない気がします。 例えば、簡易オンライン予約システムみたいなものを作る場合も、これを使うことで簡単に構築できてしまいます。 次のように、赤やオレンジ、などでステータスを表示することが出来ます。 各状態
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
5509.me
DOUTOR It's My Time ほっとできる時間・・・それがあるから自分らしくいられる
ドメインの空きをAjaxで即座に一括チェックできる「pcnames.com」:phpspot開発日誌
このページを見るには、ログインまたは登録してください
ピュアCSS3を使ったajaxアニメーション実装例:phpspot開発日誌