2008年2月アーカイブ

IE(Internet Explorer)6で、ページ内にある画像(200×200ピクセル以上)にマウスポインタを合わせると、印刷や保存などの4つのかアイコンがついた小さなイメージ ツール バーが出てきます。

私はどうしても必要な時以外IEは使っていませんが、たまに使うとなん目ざわりで、"この機能はだれが使っているのだろう"と、お節介な事も考えてしまいます。

そこで、この機能をブラウザ側で無効にする方法と、html作成時に無効にする(表示されないページを作る)方法を記します。

1.ブラウザ側の設定で無効にする

? [ツール] メニューの [インターネット オプション] をクリックしする。
? [詳細設定] タブで、[マルチメディア] の [イメージ ツール  バーを有効にする] チェック ボックスをオフにする。
(有効に戻すには、チェック ボックスをオン)

2.Web ページから直接無効にする

?画像をポイントしてイメージ ツール バーを表示し、イメージ ツール バーをマウスの右ボタンでクリックする。
?[イメージ ツール バーを無効にする] をクリックします。

3.html作成時 無効なるページを作る

その1:画像単位で無効にする 
 imgタグの指定で無効にする
  imgタグに galleryimg="no" を追加する。
        <img src="" galleryimg="">

その2:ページ内にあるすべての画像で無効にする
 metaタグの指定で無効にする
   <head>タグ内に
    <meta http-equiv="Imagetoolbar" content="no">
    と記述する。

オブジェクトを半透明するCSSの設定。

IEのみのだけでなく、Firefox、Opera、Netscape、Safariでも同じように半透明で表示することができる。

サンプル

次のコードでIE、Firefox、Opera、Netscape、Safariで半透明で表示できる。
---------------------------
filter:alpha(opacity=60);
-moz-opacity:0.6;
opacity:0.6;
zoom: 1.0;
---------------------------

IE
alpha(opacity=透明度);
100が100%

IEの場合、次のスタイルのいずれかが設定されていないと半透明にはならない。

プロパティ     
display     inline-block
height      任意の値
width       任意の値
float      left または right
position     absolute
writing-mode   tb-rl
zoom       任意の値

(指定する値が無い時はとりあえず、「zoom: 1.0;」とすれば良いと思う。)

Firefox・Netscape
-moz-opacity:透明度;
1.0が100%

Opera・Safari
opacity:透明度;
1.0が100%

opacity:透明度;がCSS3.0から実装されるみたいなので、そうなるとこの設定でFirefox、Opera、Safari、Netscapeなど多くのブラウザで表示可能となるだろう。
ただし、IEは対応しないようだ。

私が試したところ、MacのIE以外ではオブジェクト半透明が実現できた。

注:ここに示したサンプルは私が制作した友人のサイトです。

ハイパーリンクを設定するa要素には次のようにtarget属性に"_blank"を指定すると新規のウィンドウを開いてリンク先を読み込むことができる。

<a href="http://kumao.net/" target="_blank">別ウィンドウで開きます。</a>

別のウエブサイトへのリンクは、新規のウィンドウで開く方が便利だとか、またそうあるべきだと言う意見も多い。

しかし、このtarget属性はXHTML 1.1、XHTML 4.01、XHTML1.0 Strictにおいては未定義で使用できない。

その理由は、制作者側の都合でウィンドウを制御してしまうことであり、別ウィンドウを開くかどうかという選択権をユーザーから奪うことになるためらしい。

仮に制作者側がtarget="_blank"を指定しなくても、別ウィンドウで開きたいユーザーは自ら操作して(Windowsの場合は、Shiftキーを押しながらマウスの左クリック)実行可能である。

しかし、実際にはよそ様のウエブサイトにリンクする場合など、新規のウィンドウで開きたい事がある。

その方法としては次のようなJavaScriptを使う事が有望である。

<a href="kumao.net/" onclick="window.open('kumao.net/'); return false;">別ウィンドウで開きます。</a>

こらなら、ステータスバーにリンク先が表示され、JavaScript が off でもリンク先に飛ぶことがでるが、いちいちonclick〜と毎回書くのが面倒なのでもっといい方法が無いかと調べた結果次の記述を参考に rel= "external"という方法を使わせていただくことにした。

Opening a link in a new window - the valid way

-------------------------------------------------
//external.js
function externalLinks(){
if(!document.getElementsByTagName){
return;
}
var _1=document.getElementsByTagName("a");
for(var i=0;i<_1.length;i++){
var _3=_1[i];
if(_3.getAttribute("href")&&_3.getAttribute("rel")=="external"){
_3.target="_blank";
}
}
}

window.onload=externalLinks;
----------------------------------------------------

このjsファイルをインクルードし、次のように aタグにrel="external"と指定と別ウィンドウで開く。

<a href="kumao.net/" rel="external">別ウィンドウで開きます。</a>

KUMAOの押入TOP

カウンタ

Twitter

books

このアーカイブについて

このページには、2008年2月に書かれたブログ記事が新しい順に公開されています。

前のアーカイブは2007年12月です。

次のアーカイブは2008年5月です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。

にほんブログ村 IT技術ブログへ
無料テンプレートならテンプレートキング

books