0

を重ねIE6/7リンク私はここで少し指導を必要とする...+テキストインデント

私は2つのリンク持って

.tarjBodyHolder{ 
    position: relative; 
    clear: both; 
    height: 152px; 
} 

.tarjBodyHolder .linkTransp{ 
    position: absolute; 
    bottom: 0px; 
    left: 0px; 
    width: 120px; 
    height: 15px; 
    z-index: 6; /*IE bug*/ 
} 
.tarjBodyHolder .linkTransp a { 
    display: block; 
    text-indent: -9999px; 
    width: 120px; 
    height: 15px; 
    overflow: hidden; 
    z-index: 6; 
} 
.tarjBodyHolder .imageHolder{ 
    position: absolute; 
    bottom: 0px; 
    left: 0px;/*IE 7 bug*/ 
} 

をこれがあります次:

imgリンクはアイテムの画像です。この写真には、アイテムが属するカテゴリが印刷されています。たとえば:DDR RAMモジュールには写真と "< < RAM MODULES"の文字列が印刷されています。これは、この文字列をクリックすると、このアイテムのこのカテゴリに移動し、そのアイテムに含まれるすべての製品が表示されます。製品の画像をクリックすると、製品の説明ページで終了します。

「見えない」(*)カテゴリのリンクと画像のリンクが重なり合っています。それが私が ポジションを使用した理由です:絶対; Firefoxでそれは本当に素晴らしい..しかし、私はIE6/7.でこれを行う方法を理解することはできませんそれはテキストのインデント:-9999px ..で動作しません私はこれをコメントすると、テキストが表示されます私はそれをクリックすることができます..しかし、それ以外の場合はできません。 私はAの幅と高さを宣言しようとしました!

(*)このリンクにはテキストが含まれているはずですが、私は「不可視」と言っていますが、-9999pxをインデントして表示できません。

答えて

1

欲しい、昔ながらのイメージマップが好きです。このような重複したリンク項目はまれには良い考えではありません。

私はあなたにイメージがあることを聞いています。画像の一部(写真部分)は説明ページにリンクしています。もう一方の部分(テキスト部分)は、カテゴリの別のURLにリンクします。

上記の画像1つと以下のテキストリンクを使用するか、<マップ>タグを使用して画像を分割してください。

Fireworks/Dreamweaverのようなものではかなり簡単です。しかし、あなたはHERESにドキュメント古き良きテキストエディタ抜け出すにしたい場合:

http://www.w3schools.com/TAGS/tag_map.asp

+0

画像はこの文字列が印刷されているので、理由です。 OLDサイトではイメージマップでこれを行っていますが、SEでこのリンクのインデックスを作成できるので、これをリンクに置き換えたいと考えています。 高速返信ありがとうございます! ^^ – KnF

関連する問題