Operaでtarget="blank"が効かない場合の対処

ハードディスクのクラッシュで、システムの復旧に伴い気づいたことをいくつかメモ。

まずは規定ブラウザとして使用しているOperaだが、インストールしなおすと新しいタブで開くはずのリンクが元のタブで開いてしまう。どうやらtarget="blank"のタブが無効になっているようだ。

とりあえず設定を見直すと、「一般設定」タブのポップアップの項目が怪しそうだ。「要求しないポップアップを無効にする」→「ポップアップをバックグラウンドで開く」に変更することで無事解決できた。

それにしても標準タグを無視するようなデフォルトの設定はどうかと思う・・・。

差分のみをバックアップできるソフト「CopyExt - 拡張コピー」

先日、システムドライブとして利用していたハードディスクが壊れてしまい、その復旧にこの3日間ほどかかりっきりになっていた。幸いなことにデータはできるだけバックアップを取っていたのでほとんどは無事だったが、それでも直近のいくつかは失われてしまった。改めてバックアップの大切さを痛感した次第である。
とはいえ、細かな調整をしたりしていると、どれが更新したデータなのかわからなくなってしまう。結局、関連するデータを丸ごとバックアップする羽目になるのだが、容量が大きかったりすると結構面倒だ。バックアップソフトでも時間がかかるのはさして変わらない。
そこで更新した差分だけをバックアップしてくれるソフトはないかと探したところ、見つけたのがこの「CopyExt - 拡張コピー」。厳密に言えばバックアップソフトではなく、Windowsのコピー&ペーストを拡張するフリーソフトだ。
使い方は簡単で、インストールすると右クリックのコンテキストメニューに「拡張コピー」や「拡張移動」といった追加項目が現れるので、コピーしたいファイルやフォルダを選択した状態でそれを選べば良い。
非常に細かな設定ができるのだが、今回使いたい機能は「日付」タブの「指定した日付より新しいファイルのみコピー」と、「コピー条件」タブの「コピー先に存在しないファイルのみコピー」の機能。これらを使えば前述した差分のみのバックアップも容易にできる。
バックアップ専門のソフトではないので、クリック一つですべて自動というわけにはいかないが、重要なデータに関わる作業だけに私などはこの方が安心できたりする。
他にも指定した拡張子のみのファイルをコピーしたり、リネームしてコピーしたりと、コピーや移動に関してはできないことがないのではないかと思わせるほど豊富な機能が満載なので、標準のコピーに不安がある方はぜひ試してみてほしい。

ダウンロードはこちらから。

iframeの高さを自動調整するTips

インラインフレームをそれと感じさせないためにスクロールバーを消したい時、困るのは読み込み先のページの高さが一定ではない場合。こんな場合のために、JavaScriptを利用したiframeの自動調整を行ってみる。

[親フレーム側の記述](<body>～</body>内)

[子フレーム側の記述](<head>～</head>内に記述)

<SCRIPT language="JavaScript">
function iframeResize(){
var PageHight = document.body.scrollHeight + 0; // ページの高さを取得
window.parent.document.getElementById('インラインフレームのID').style.height = PageHight + 'px'; // iframeの高さを変更
}
window.onload = iframeResize;
</SCRIPT>

ただし、子フレーム側のbody内の記述で一番下になるブロック要素にマージンがあると上手くいかないようだ。この場合、ダミーのブロック要素を最後に挿入すれば良い。

IEでiframeのボーダーを消すTips

以下のような記述でインラインフレームを使ったところ、モダンブラウザでは問題ないが、IEではポーターが消えないことが判明したので、その対策を自分的にメモ。

[元のHTML側]

[元のCSS側]

.iframe_block {
border-style: none;
}

対策はCSSではなく、HTML側にframeborder="0"を記述する。

[修正したHTML側]

わざわざ見本を用意するほどのことでもないので、今回は文章のみ。

アメーバブログのフリースペースでロールオーバー画像を設置するTips

アメブロのフリースペースにロールオーバー画像を設置しようとしたらできなかった。どうやら、onmouseoverなどが禁止タグに設定されているようだ。

そこでCSSだけを使ってロールオーバー効果を実現する方法を紹介しよう。

まず、HTML(フリースペース)部の記述だが、以下のようにリンクだけを設置しておく。

続いてCSSの記述だが、要はaタグをdisplay:blockでブロック要素として指定し、その背景に画像を指定。a:hoverタグに別の背景画像を指定することで、ロールオーバー効果を演出している。

.指定したクラス名 a {
width: 画像の横サイズ;
height: 画像の縦サイズ;
background: url(元の画像のURL) no-repeat;
}

.指定したクラス名 a:hover {
background: url(切替える画像のURL) no-repeat;
}

上記の例では2枚の画像を利用したが、元の画像と切替え後の画像を1枚に連結しておき、background-positionで、半分ずつ切替えて表示するという方法でも良いだろう。

背景画像を切替えているだけなので、当然ながらHTMLのリンク内にテキストを記述すれば、それを表示させることも可能だ。

<< 前ページ次ページ >>

to be continued ~とあるプログラマーの実験的開発日誌~

WEBデザイナー兼プログラマーである管理人が日々のトラブル解決に向けて奮闘する開発日誌。

Operaでtarget="blank"が効かない場合の対処

差分のみをバックアップできるソフト「CopyExt - 拡張コピー」

iframeの高さを自動調整するTips

IEでiframeのボーダーを消すTips

アメーバブログのフリースペースでロールオーバー画像を設置するTips