JQueryのスプライト処理(しましまレイアウト)

以前「:even」「:odd」でテーブルの等のストライプ処理をするとメモしましたが、
「:even」「:odd」は全体の通し番号での奇数と偶数の場所に適応されるため、
複数の要素に対してかけたい場合に不向きであるということが判明。(いまさら)

以下メモ

$(function(){
$("クラスを当てたいセレクタ:nth-child(even)").addClass("付加するクラス");
$("クラスを当てたいセレクタ:nth-child(odd)").addClass("付加するクラス");
});

:nth-child(even)
→偶数番目の要素に対して付加する命令。
:nth-child(odd)
→奇数版目の要素に対して付加する命令。

今回このようなものをとある場所で実装してみました。
http://webos-goodies.jp/archives/getting_started_with_at_anywhere.html
ページ遷移することなくTiwtter関連の操作をWebページに盛り込むことができるらしいです。

以下自分用簡単めも。

Twitter developersにアクセス
http://dev.twitter.com/

右上の「Sign in」からTwitterアカウントでログイン。

アプリケーションの設定をする。
注意点は以下の2つ。

「コールバックURL」は@Anywhere を利用する Web アプリケーションのドメインとサブドメインの両方に一致しなくてはならないということ。
あまりピンとこないのですが、「アプリケーションのウェブサイトURL」と同じものを入れたら大丈夫です。

「Default Access type」は「Read & Write」にしなくてはならない。
デフォルトでは「Read-only 」になっているので忘れずに変更すること。

ここまでは楽勝だったのですが、参考ブログを真似してもなんとも動かない。

CSSコーディングが常識となった今でも、
テーブル時代に作ったサイトがまだ残っています。

「これを期に!SEO的にもリニューアルを!」
みたいに全てのサイトがCSSコーディングになればいいのですが、
この不景気でそうもいかず。

ただ、そんなテーブルサイトも運用は普通にしているので、
テーブル超入れ子サイトをさわることもしばしばあります。

また、運用の場合は、
お客さんやディレクターさん自らソースをさわることがあります。
テーブルだとちょっとしたことで余計な空白が入ってしまうことがあり、
壊れると、どうしたら直せるのか質問がきます。

そんな時に役立つ情報をメモ。
(前置きが長い)

murasaki.jpg

お気に入りのつけ麺ですが、家から少し遠くてあまり行けていないです。
逆に家から近かったら毎日のように通ってしまい、メタボフラグですね。

麺は極太麺。かなり食べ応えがあります。
つけだれは白菜がたっぷり入っていて、
白菜の甘味がものすごく出ています。

最近行ってないからいきたいなぁ。

◆HTML5 における HTML4 からの変更点
http://standards.mitsue.co.jp/resources/w3c/TR/html5-diff/

◆Simple Website Layout Tutorial Using HTML 5 and CSS 3
http://www.designzzz.com/website-layout-tutorial-html-5-css-3/
デモ→ http://www.designzzz.com/html-5-tutorial.html

◆HTML5 and The Future of the Web
http://www.smashingmagazine.com/2009/07/16/html5-and-the-future-of-the-web/

◆HTML 5 Demos and Examples
http://html5demos.com/

◆HTML 5 - Video Demo
http://shapeshed.com/examples/HTML5-video-element/

◆html5で videoの任意のフレームをcanvasに描画するメモ
http://d.hatena.ne.jp/favril/20100225/1267099197

◆Everything you need to know about HTML5 video and audio
http://my.opera.com/core/blog/2010/03/03/everything-you-need-to-know-about-html5-video-and-audio-2

◆Flashだとここまでできる! HTML5とFlashの機能比較
http://clockmaker.jp/blog/2010/02/flash-vs-html5/

◆Youtube
http://www.youtube.com/

◆Vimeo
http://vimeo.com/

◆Zoome
http://www.zoome.jp/

◆HTML5.jp
http://www.html5.jp/

◆<video>タグで動画を埋め込む
http://www.htmq.com/html5/004.shtml

◆Jilion - SublimeVideo
http://jilion.com/sublime/video

◆HTML5の可能性を垣間見る「Blowing up HTML5 video and mapping it into 3D space」
http://design-develop.net/design/blowing-up-html5-video-and-mapping-it-into-3d-space.html

◆HTML 5のマルチメディア(オーディオ/ビデオ)サポート紹介
http://codezine.jp/article/detail/4817