2007.09.26
「新規ウィンドウの小技」
サイト制作好きです。
WEB標準めんどいです。
Takumaです。
【WEB標準】
W3Cが勧告しているWWW関連の規格のことである。特にウェブサイト製作に関わるHTMLやCSS、DOM、WCAG等のことを言う。 (by ウィキペディア)
http://ja.wikipedia.org/wiki/%E3%82%A6%E3%82%A7%E3%83%96%E6%A8%
99%E6%BA%96
今回はWEBの制作ネタのお話です。みなさま
▼Another HTML-lint gateway▼
http://htmllint.itc.keio.ac.jp/htmllint/htmllint.html
というサイトはご存知でしょうか?W3Cが勧告している「正しいとされているhtml記述」をチェックできるサイトです。
Takumaも以前、公共機関のサイトを作ったことがあるのですが、こちらのサイトで全ページ「80点以上(←たしか)」という営業からの無茶振りを受けなきながらお世話になったことがあります。
あの頃、cssによる分離型コーディングも走り出しで高級品感覚だったのに3年もたてば、いまや常識となってしまいました。と前置きはコレぐらいにして今回は、
WEB標準対応(?)の新規ウィンドウの出し方のお話です。
Takumaもコーディング業務から離れて久しいのですが、
そんな私でも、お勉強のために作品サイトを活用しております。
(↑コーディングのスペシャリストには、かなり適わないですけど。。。)
そんな中、「Another HTML」でソースコードをチェックした際に上記の警告をされました。
簡単に訳すと
「何年も前から使うなっていってるだろ!いい加減、使うのやめろよ!!(怒)」
というないようです。
タグの「TARGET属性」は「_blank」と指定するとリンク先を新規ウィンドウで開いてくれます。(←外部リンク等に有効なリンクのしかたなのです。)
しかしながら、使うなとおっしゃる(号泣)。。。
というわけで回避策を探していたところ、
素敵な解決法が紹介されていたので、作品サイトでも一部反映してみた。
javascriprを使用
外部jsファイルを用意し、aタグ内にclassを指定することにより別ウィンドウリンクを設定。
■ 外部jsファイルの内容 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
window.onload = function() {
var node_a = document.getElementsByTagName(’a');
for (var i in node_a) {
if (node_a[i].className == ‘newwin’) {
node_a[i].onclick = function() {
window.open(this.href, ”, ”);
return false;
};
}
}
};
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
▼元ネタ:mikiさん▼
http://bodytalk.girly.jp/
▼紹介/解説:REDLINEさん▼
http://blog.livedoor.jp/red_line/archives/50765597.html
この方法でやんないと
リンクごとにjavascriptを直接記述しなくてはならなそうで、困ってたのです。
というわけで「Another HTML」のご機嫌をとるのに、
一つ大きなハードルを超えたと思ったのですが、
(↑「Safari」では正常動作しないらしい。)
お仕事ではちょっと厳しいかも。。。
users
Category:デザイン | No Comments
- 「総統の夢.jpの全クリア攻略法」 users
- 「Windows7のマルチタッチ技術の評論」 users
- 「Wolfram|Alpha(ウルフラムアルファ)がリリース」 users
- 「2009解散総選挙のGoogle選挙コンテンツ」 users
- 「大怪獣バトル ウルトラ銀河伝説 THE MOVIE を見てきた」 users
- 「Google Ajax Feeds APIを導入しました」 users
- 「2009年上半期の検索ランキング(とモバイルSNS)」 users
- 「メアリーブレア展に行ってきた」 users
- 「画像サムネイルを並べるRandom Image Plugin(for WordPress)」 users
- 「いろんな写真ジェネレーター」 users










Comment & Trackback
Comment