[jQuery]アーカイブ
スマートフォン対応の需要がどんどん広がっていますね。
以前に書いた以下のスマートフォン系二つの記事が人気がある事からも、今年はますます対応を迫られるでしょう。
Webサイトをスマートフォン対応してと言われた時に見ておきたいサイトまとめ
タブレットPCが多すぎて分からないので一覧化してみた、電子書籍リーダーもあるよ
実際のスマートフォン向けサイトの制作の話は置いておいて、出来上がった後にPC版から宣伝する必要があります。
その際に役に立つのがQRコードです。
今回はjQueryプラグインを利用して、小スペースでQRコードを表示する方法をご紹介します。
サンプル⇒
上のアイコンにマウスを乗せてみて下さい。
タイトルの通りなのですが、zenbackがjQueryと競合してエラーを吐き出しております。正直ここにたどり着くまでも随分時間かかりました。。
調べてみるとzenbackのコード内で、更にjQueryを読み込みしていてその辺りが原因でしょう。
今回おきた現象はjQueryプラグインのqrTipとの共存がIEのみ（爆発しろ）でうまくいかない、という現象でした。
元々読み込んでいたjQueryはバージョン1.4.4です。
jQueryを使ってサイトツアーを作る方法を試してみた | Liglogを読んで、この実装方法なら合っても便利かも！と思いちゃちゃっと導入してみました。
サンプル：サイトツアーを開始する
↑リンクをクリックするとツアーが始まります。
実装に関しては参考サイトがとても詳しいのでそちらをご覧ください。
⇒jQueryを使ってサイトツアーを作る方法を試してみた | Liglog
1.jQueryのeasingプラグインとCSSの読み込み
2.サイトツアー部分のscriptの修正と読み込み
3.click時に呼び出し
で、完成です。お手軽でした。
jQueryのバージョンは1.3.1では動かなかったので、1.4.4に変更しました。
おさえておいた方が良さそうなドキュメントページ
jQuery Easing - jQuery 日本語リファレンス
jQuery:1.3の新機能「live」を試してみる | THE HAM MEDIA BLOG
このブログに設置しているペタペタ掲示板ですが、書き込んで頂いた内容に「削除は出来ないのか」という内容が多かったので削除機能を追加してみました。
動作はペタペタ掲示板よりご確認下さい。
では、実装方法について書いていきたいと思います。
前回の内容をご覧いただいていない方は、そちらから見て頂けると分かりやすいです。
⇒前回：jQueryとPHPで付箋をペタペタ貼れるメッセージボードを作成する
かかえているサイトを急にスマートフォン対応して！
なんて時に困らない様に、スマートフォン特有のデザインやユーザビリティ等、構築時に抑えておきたいサイト・記事を集めました。
半分位自分用メモですが、何かの役に立てば幸いです。
画面内に付箋を貼るようなUIの掲示板を作れるPHP＆jQueryなサンプルプログラム:phpspot開発日誌を改良しつつこのブログに設置してみました。
日本語もOK!Ajaxとphp,JQueryで作る付箋メモシステム「Sticky Notes With AJAX, PHP & jQuery」 | DesignDevelopでも紹介されていますね。
動作は以下からご確認下さい。
⇒ペタペタ掲示板
2011/01/11追記
削除対応版の記事書きました。
設置にあたってデフォルトからカスタマイズした点は以下の通りです。
- 表示条件
- 日本語化
- 書き込み時にメール送信
それでは設置の手順を紹介して行きたいと思います。
前回記事で作成したjQueryとcookieを使用した開閉メニューを、頂いたアドバイスで閃いたやり方と合わせて、よりjQueryっぽい記述に修正しましたので変更点を書いていきたいと思います。
まずは、完成サンプル
⇒【よりjQueryらしい】cookieを使用して開閉を保持するメニュー完成サンプル
前回記事をまだ読んでいない方はjQueryとjquery.cookie.jsを使って開閉を保持するメニューを作ってみるを先にご覧ください。
今回のサンプルでは
本当はopendd[0]~[n]というcookieが複数セットされるのを避けたかったのですが、うまく記述できませんでした＞＜
詳しい方アドバイスとか頂けると元気出ます！よろしくお願いします。
と前回嘆いていた部分を改善して、よりjQueryらしい記述に変更しています。
それではサンプルの説明をしていきます。
caraldo_K
Webディレクター的な事やってます！iPhone楽しい！マラソン・ロードバイクで肉体改造計画中！でも一番好きなのは漫画です㌰㌰⋋( 'Θ')⋌㌰㌰
poooooon
俗に言うWeb屋の人。馬車馬のように働きお休みがありません。いつか目の前に天使ちゃんが舞い降りてきてくれるのではないかと妄想を膨らませる毎日。
- Web [83]
- スマートフォン [29]
- デザインツール [13]
- Fireworks [4]
- Illustrator [1]
- Photoshop [6]
- パソコン [33]
- プログラミング [49]
- JavaScript [25]
- MovableType [24]
- PHP [9]
- 個人的ななにか [58]
