こんな感じです
画面左上の「tweet」ボタンをクリックすると、drag&drop可能な入力欄が表示される。
この枠をドラッグしたり、文字を打ち込んだりすると
別画面で同じページを見ている別ユーザーの画面上でリアルタイムに更新される。
参考
参考にしたのは↓こちら
第15回 jQuery UI Draggableを使って付箋(sticky)を作ってみる jQuery入門
http://ponk.jp/?p=2441&cpage=1
Block Rockin’ Codes
http://d.hatena.ne.jp/Jxck/20110730/1312042603
動作
localhostだけど動作もすこぶるスムーズですね。
chromeでマルチバイト入力時にエラーになりますね。
⇒要調査
ソース
1. ↓こちらにあげました
https://github.com/ryooo321/node_websocket_chat_box
2. 展開したディレクトリにchdirして、↓コマンドでサーバ起動
C:\wk\20111004\chat_boad> node.exe app.js
Express server listening on port 3000 in development mode
[36minfo - [39m socket.io started
3. ↓こちらにアクセス
http://localhost:3000/sample.html
0 件のコメント:
コメントを投稿