全8サイト！SNSのカウント取得方法まとめ 2014年6月版
ソーシャルシェアボタンをオリジナルデザインにしたかったり、いいね！数のデータを元にランキングシステムなどを作りたい場合に役立つ「ソーシャルカウントの取得方法」をまとめました。取得方法はサーバーサイド(PHP)、クライアントサイド(Javascript)の両パターンを取り上げています。よろしければ参考にしてみて下さい！なお、Twitterのカウントは2015年11月20日以降、取得できなくなりました。
ファイルサイズを取得する - by AOK
AOK's JavaScript Sample 動作確認： ○IE6SP2,IE7(WinXP) ○Firefox1.5(WinXP) インターネット上でファイルサイズを取得する方法についてのサンプルです。たとえば、サムネール画像を表示して、元の画像へリンクを張ったり、圧縮ファイルなどにリンクを張ってダウンロードさせたりする場合、リンク先のファイルサイズが表示されていると親切です。しかし、いちいちファイルサイズを調べて入力するのも面倒なので、なんとか、スクリプトで自動化してみました。ファイルサイズの取得に XMLHttpRequest を使用しているので、サポートされていないブラウザでは動作しません。また、XMLHttpRequest はドメイン間をまたぐ処理ができないので、他サイトのファイルサイズは取得できません。 ■ サンプル
PCソフト備忘録 - FC2 BLOG パスワード認証
ブログ パスワード認証 閲覧するには管理人が設定した パスワードの入力が必要です。 管理人からのメッセージ 閲覧パスワード Copyright © since 1999 FC2 inc. All Rights Reserved.
Google Chrome Extensions (拡張機能) を作ってみる : Serendip – Webデザイン・プログラミング
Linux版の Google Chrome で拡張機能を作ってみた際のメモ。 Google のサンプルコードとチュートリアル (Google Chrome Extensions – Google Code) や "特集：先取り！ Google Chrome Extensions｜gihyo.jp … 技術評論社" の記事を参考にして Fastladder の未読記事数を表示する拡張機能を作ってみる。 Manifest file まず、Manifest file (manifest.json) を作成する。 これは、拡張機能の各種情報を記述した JSON 形式のファイルで、以下のように記述する。 { "name" : "Fastladder Notify", "version" : "1.0", "description" : "Notify unread Fastladder entry.
Documentに繋がってないDOMツリーから要素を探す場合querySelector()を使う - 最高のコンピューティング環境とは？
正確にはDocumentのroot elementが属するツリーのサブツリーでないDOMツリーから要素を探す場合。下記のようなケース。 htmlの塊をテンプレートとして使いたいので、Documentに繋がってない要素にinnerHTMLでhtmlの塊を挿入する そのhtmlの塊の中に、属性の変更をしたい要素があるので、何らかの方法でその要素を取り出したい その時点でDocumentに繋がってないので、getElementById()等で取り出せない(DocumentFragmentはDocumentを継承してないのでそのようなIFはない) ツリーをjavascriptの世界で辿るのはやりたくない querySelector()やquerySelectorAll()はNodeSelector IFのメソッドなので、DocumentFragment, Elementなどが継承している。 よって
WebSocketを使ってなんちゃってビデオチャットを作ってみた - いろいろな何か
はじめに 以下のページでjQueryでWebカメラを操作できると知ったので、WebSocketを使ってなんちゃってビデオチャットを書いてみました。 WebSocketサーバに接続した2名で1対1のビデオチャットが出来ます。送受信するデータはカメラの映像とテキストのみで、音声データの送受信には対応していません。 jQueryからウェブカムをコントロールするためのプラグイン『jQuery Webcam Plugin』 | IDEA*IDEA 実行環境 Chrome 10.0.612.3 dev Firefox 4 beta 7 node.js 0.3.1 node-websocket-server 1.4.01 jQuery webcam plugin WebScoketサーバ側のプログラム 今回はnode.jsを使ってサーバ側のプログラムを書きました。 videoChatServer.js
モダンブラウザで使う「Geolocation API」前編
（2011/04/15 追記） 広義の HTML5、狭義の HTML5 について追記しました もりやまです。 最近比較的余裕があるので色々調べたりしているのですが、今回はブラウザの位置情報取得機能（Geolocation API）について調べてみました。 携帯端末では昔から結構使われていましたが、今回調べてみたところ、ほとんどのモダンブラウザが対応していることがわかりました。 というわけで、ここにまとめてみます。 Geolocation API とは ホストデバイスに関連する地理的な位置情報へのスクリプトによるアクセスを提供する API です。 ザックリ言ってしまうと、ブラウザ上で動く JavaScript から現在の位置情報を取得するためのAPI の仕様、ということです。 W3C で策定中の規格で、現在は最終草案（Last Call Working Draft）の段階です。 よく「HTM
Javascriptのescape関数で判読を難しくする
株式会社プランセスの全面協力の元、HTML暗号化ソフト「SHTML」を2005年7月11日にリリースしました。 Javascriptの知識が全くない方でも利用可能なように設計されています。最短ステップの場合、暗号化したいソースを貼り付けて、「暗号化する」ボタンをクリックするだけです!! 右クリック禁止+ソースの暗号化＋印刷禁止+テキスト選択禁止・・・が今までにないほど簡単に!! Javascriptのescape関数を用いると、日本語などそのままURLに渡すと問題が起こる可能性のある文字をエンコードしてくれます。IEでは、ユニコードにエンコードしてくれます。例えば、「あ」という文字はIEでは「%u3042」と「%u」で始まる文字列にエンコードしてくれます。 一方、Netscapeでは、escape関数を用いると文字列をISO-Latin-1コード（ASCIIコード）に変換してくれます。例え
Canvas Pad
// Draw black rect ctx.fillRect(50, 20, 145, 145); // Draw blue rect ctx.fillStyle = "rgb(0, 162, 232)"; ctx.fillRect(135, 85, 125, 125); // Increase line width ctx.lineWidth = 5; // Draw black rect outline ctx.strokeStyle = "rgb(0, 0, 0)"; ctx.strokeRect(50, 335, 145, 145); // Draw blue rect outline ctx.strokeStyle = "rgb(0, 162, 232)"; ctx.strokeRect(135, 275, 125, 125); // Draw transparent yell
美しい写真スタック
In this tutorial we are going to create a nice and fresh image gallery. The idea is to show the albums as a slider, and when an album is chosen, […] In this tutorial we are going to create a nice and fresh image gallery. The idea is to show the albums as a slider, and when an album is chosen, we show the images of that album as a beautiful photo stack. In the photo stack view, we can browse throug
Choose Your Own HTML 5 Adventure
Canvas: Drawing Board (Tested in FF 3.01+, Safari 4.0b, Opera 9.62, Chrome 2.0) Canvas: 1st-Person Gifter (Tested in FF 3.01+, Safari 4.0b, Opera 9.62, Chrome 2.0) Canvas: Bespin (Tested in FF 3.01+, Safari 4.0b, Chrome 2.0) Video: Basic Player (Tested in FF 3.5b4+, Opera 9.62 [w/out CSS rotate]) Video: YouTube (Tested in Safari 4.0b) Geolocation: Google Maps (Tested in FF 3.5b4+) Geolocation: Goo
プログラミング勉強用サイト javascript イベントハンドラのコールバック関数に引数を渡す
こんな方法があるとは思わなかった。 頭いいなぁ。 http://d.hatena.ne.jp/uriyuri/20081014/1223974862 function someFunc(msg1, msg2) { return function(ev) { ev も msg1,msg2も使える } } btn = document.getElementById("btn"); btn.addEventListener("click", someFunc('hoge1', 'hoge2'), true); //コンパイラがJAVASCRIPTを解析する時に、 //このコードがloadされると、someFunc()を実行する //すると、someFunc()はfunction()を返すので、 //btn.addEventListener("click", function(ev){ 引数の
Flash Player 10 で クリップボードにコピーする方法
Flash Player 10からSystem.setClipboard()の使用が制限されました。Adobeのページを参考 どーゆーことかって言うと、クリップボードへの情報の貼り付けはIE以外はFlashで行えるのですが、それが出来なくなるってことです。 一番手っ取り早い解決策はボタンそのものをFlashにしてしまうことです。参考サイト 今扱ってる案件ではボタンの種類が多く、ボタンの数の分だけFlashを作るわけにもいかないので、透過Flashにして今までどおり使えるようにしました。 動作にはPrototypeが必要です。 PrototypeとFlashの良い勉強になりました。 Sample Code JavaScript function pasteff(id,text){ if(Prototype.Browser.IE){ return; } var offset = $(id).p
複数のCSS/JavaScriptを結合＆圧縮·phpFlair MOONGIFT
phpFlairはPHP製Webベースのオープンソース・ソフトウェア。jQueryなどのJavaScriptフレームワークやCSSフレームワークを用いていると、ついつい一度のアクセスで多数のコネクションが張られるようになる。これではサーバの負荷はもちろんクライアントでも表示が遅くなってしまう。 利用するサンプル（公式サイトより） そこで考えたいのがJavaScript/CSSファイルをそれぞれ結合して一度のアクセスで済ませてしまう方法だ。手作業でもできるが、メンテナンスを考えると自動処理の方が便利そうだ。phpFlairを使えばそれを簡単に実現できる。 phpFlairはPHPで作られているのでPHPを使ったプロジェクトでは手軽に導入できそうだ。JavaScriptファイルやCSSファイルを表示する際にphpFlairを経由して呼び出すことでキャッシュしたり、レスポンスのヘッダにもキャッシ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Smooth Scrolling without jQuery (Example)
http://www.crystal-creation.com/web-appli/technical-information/programming/javascript/ajax/
Aext.net
Blogger