東京渋谷 “HTML5入門&jQuery” 勉強会(5/26)を行いました。 jQueryをおぼえよう!ということで、HTML5のざっくりとした解説と、jQueryの基本的な使い方を学習します!詳細:ATND そのときのスライドおよび資料を公開します。 今後も勉強会を開催する予定です。 twitterのハッシュタグ #gooyaHub で告知していきますので よかったら参加してみてください!
スマホアプリ開発は HTML5/jQuery Mobileとネイティブ どっちがいいの? 第2回テックヒルズまとめレポート 柴田克己 2012/4/27 iPhoneやAndroid端末の急速な普及を受け、多くの開発者が近年関心を寄せているのが「HTML5で実現できるWebアプリと、各プラットフォーム向けに特化したネイティブアプリ。開発するならどちらがトク?」というテーマだ。 2012年4月13日に、このテーマについて実際にスマホやWeb向けのアプリ開発を手掛けている技術者たちが意見を戦わせる「第2回テックヒルズ『ネイティブアプリ』vs『Webアプリ』~これからのアプリ開発のトレンド~」と題したディスカッションイベントが、六本木アカデミーヒルズで開催された。 司会進行を務めたのは、同イベントを企画、運営するインターネットサービス企業「CROOZ」の技術統括本部取締役の小俣泰明氏だ。 小俣氏
jQueryのSortableとem-websocketを組み合わせ、同じページをブラウザで閲覧中のユーザが、共同してリストの順番などを変更できないかRuby on Railsで試してみました。 また誰かが操作中は、警告アイコンを表示するようにしました。 ソース http://github.com/nkmrshn/share_sortable 用意 Gemfileにem-websocketを追加し、「bundle install」でインストールします。 gem 'em-websocket' gem 'jquery-rails'また、今回はprototype.jsではなくjQueryなので、jquery-railsも追加し、アプリの作成は「rails new APP_NAME -J」とprototype.jsを作らず、インストール後に rails generate jquery:instal
いつぞやの飲み会で、 これだけウェブの技術が進化しているのだから、もっとオシャレなエロサイトがあってもいいんでないかい? << という話になりまして。 だけどどうせ作るんならということで、Rails3 と jQuery を使って結構マジメにつくってみました。 (※大人の事情により、リンクはやむなく削除しました) 当初はエロにオシャレは必要ないのかなーと思ったときもありましたが、いざつくってみると、やっぱり選べるならオシャレなやつの方ががいいよね、という結論に落ち着きました。 今回つくったのは試験的なものなので 90日間限定でしか公開しないつもりですが、日本のエロサイトが今後もっとオシャレに発展していくきっかけになってくれたら嬉しいです。 以下、サイトのコンセプトや使っている技術についてまとめてみます。 **Rails3 と jQuery で真面目にオシャレなエロサイトをつくってみました 1
ダブルタップイベントを利用可能にするjQueryプラグイン「jquery.event.dblTap.js」 Check Tweet 配布元:iPhone/iPadでダブルタップが利用できるjQueryプラグイン「jquery.event.dblTap.js」[to-R] ライセンス:MITライセンス 「jquery.event.dblTap.js」はiPhone/iPad、Androidなどのスマートフォンでダブルタップイベントが利用可能になるjQueryプラグインです。 利用方法 配布サイトよりダウンロードした「jquery.event.dblTap.js」をjQuery本体の後に読み込みます。 <script src="jquery-.min.js"></script> <script src="jquery.event.dblTap.js"></script> ダブルタップイベントを
Posted: 2011.02.25 / Category: javascript / Tag: jQuery, Twitter Twitterのトップページは人気のツイートが次々とスライドして表示されてますね。 この記事ではjQueryを使用して見た目のスライドするだけの部分を再現してみたいと思います。 ベースとなるhtml+css Twitterの場合は裏でajax的なことを色々やっているのだと思いますが、見た目しか再現しないのでプレーンなhtmlを使用します。 html <div id="slide"> <ul> <li> <strong>2011.02.01</strong> 最初です。最初だけどむしろ最後です。 </li> <li> <strong>2011.02.12</strong> Twitterのトップページのようにコンテンツを一定の時間でスライドさせてみます。<br /
はじめに Railsが3になってしばらく経ちました。 数々の新機能や大幅な機能拡張があり、その中にはjavascriptに関する変更もありました。 いままでデフォルトでprototype.jsを基本としたJavascriptフレームワークを使用していたのを、Rails3からはシンプルに(jrailsを使うことなく)jQueryを使うことができるようになりました。*1 正確には、特定のjavascriptフレームワークに囚われない、ですかね。 それで、link_to_remote が link_to hoge_url, :remote => true に変更になったとかは割と文献があるんですが、次のステップで必ずぶち当たるであろう「じゃあloadingとかどうすんだよ」という文献があまり見当たらなかったので書いてみようと思います。 結論 rails.jsをちょっと改造する jquery.js
前の奴は幅が狭い列で表示が醜かったので、やっぱり書きなおし。orz ソースを晒しておく <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>jQuery tooltip TEST</title> <style type="text/css"> td { border-style: solid; border-width:1px; border-color: #000000; } .error { background-color: #eebbbb; } .normal { background-color: #eeffff; } span.tooltip { position: absolute; top: -10000px; left: -10000px; d
とりあえず、ソースを晒しておく <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>jQuery tooltip TEST</title> <style type="text/css"> td { width: 12em; border-style: solid; border-width:1px; border-color: #000000; } div.cell { position:relative; height: 1.4em; } .error { background-color: #eebbbb; } .normal { background-color: #eeffff; } span.value { position: absolute; to
TransmitはjQuery製のFlashベースのマルチファイルアップローダー。 TransmitはjQuery/JavaScript製のオープンソース・ソフトウェア。HTML5では複数ファイルを一括アップロードすることができる。だがそのために既存サイトをHTML5に移行させるのは現実的ではないだろう。そこでよく使われるのがFlashによるマルチファイルアップローダーだ。 ファイルを指定した後の表示 最も有名なライブラリはSWFUploadではないだろうか。だが実際に使う上では色々とコツがいる。もっと手軽に実現するためのライブラリはないだろうかと考えていた所で見つけたのがTransmitになる。何と言ってもjQueryベースなのが良い。 使い方は簡単で、transmitというメソッドとアップロード先のURLを指定するだけで良い。オプションとしてクロスドメインの可否、ファイルタイプの指定、
Windows7のようにウィンドウを透過させたい。 そんなときに使えそうなのが、『AeroWindow』。Windows7のような透過ウィンドウを実現するjQueryプラグインです。 divを透過させて、重なったときに後ろが透けて見せることができますね。ダブルクリックすると、びよーんと拡大したり、右下をドラッグするとリサイズすることができます。 デモは以下から。 オンラインデモ 動きが気持ちいいので、一度見てみてください。 AeroWindow gihyoさんでの連載が始まりました。最近のかっこいいUIについて考えたり、作り方を紹介したりしていくので、よろしければご覧ください。 第1回 使いやすいメニューはどう作る? ?水平メニュー あと代官山で物件を見てきました。めちゃくちゃかっこいいんだけど、うーんもうちょい探そうかな。
クライアントからのリクエストに対してすぐに応答せず溜めておき、何らかのタイミングを見計らって応答する技術。 Comet - Wikipedia 例えばチャットなんかで使うと、相手が発言したタイミングでレスポンスが返ってくるので、リアルタイムに会話が出来たりする訳です。 ※あくまでも実装の一例なので、このままでは利用シーンがかなり限定される事をご留意下さい。 注意事項 以下の実装方法は、知識的なコストがあまり必要ない替わりに、サーバー的なコストを多く消費します。 共有レンタルサーバーなんかで使うと、アカウント制限・停止などの処置がとられる場合があるので、共有で使うスペースなどでの使用は避け、専用サーバーや自前のサーバーなどで使用して下さい。 Comet動作の流れ 大まかな流れはこんな感じです。 Ajax(XMLHttpRequest)を利用してサーバー(PHP)にリクエストを送る リクエスト
前回まではjQueryの基本的な使い方を解説してきましたが、今回からは実務で使える、より実践的なテクニックとサンプルを紹介していきます。今回はjQueryでCSS3のセレクターを利用し、テーブル(表組み)を見やすくスタイリングする「ストライプテーブル」を作成します。 CSS3のセレクターを使えば作業効率がアップ 「CSS3(Cascading Style Sheets, level 3)」は、W3C(World Wide Web Consortium)が策定を進めているCSSの新しい規格です。CSS3ではさまざまなプロパティやセレクターが追加され、現在の主流となっている「CSS2.1」では苦労していた作業を効率化できるようになっています。 CSS3の一部機能は、すでにFirefoxやSafari/Google Chrome、OperaなどのWebブラウザーに先行して実装されていますが、実際
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ?'); }, function(){ $(this).text('ヌー'); } );
コンテンツ PHP入門 jQuery入門 Flash Flash(ActionScript)でゲーム作成入門 Flash(ActionScript)で様々なゲームを作ろう Flash(ActionScript)とPHPの連携入門 PHP(旧コンテンツ) PHPでファイルの読み書き・掲示板 PHPで日付・時刻の計算 PHPでアクセスカウンタ&解析 PHPでGDを使ってみよう PHPとPostgreSQLの連携入門 Java (旧コンテンツ) Javaでシューティングゲームを作ろう Perl (旧コンテンツ) CGI(Perl)の基本と掲示板作成 C/C++ C/C++言語とDXライブラリでゲーム作成入門 (旧コンテンツ)C言語とelで様々なゲームを作ろう jQuery simple plugins ひとりごと、ふたりごと(ブログパーツ) オリジナルソフトウェア その他未分類なモノ iOSアプ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く