2011-07-13 15 views
3

私はthis code for demonstrationです。それは私のリンクをFirefox全体で広げてくれますが、Firefoxではうまくいきますが、IE上でカーソルをテキスト上に移動するとテキストカーソルに変わり、そこではリンクが動きません... z-indexで試してみましたが、結果はありません... ?私は、自分のコンテンツを持つ他のdivと私のdivを記入する必要がIEにカーソルが含まれていると、div全体がリンクしていません

、そう

a style="display: block" 

はオプション、私はまたにあなたのコードを変更し

onclick="location.href= 
+0

同じ質問がここに返されます。 http://stackoverflow.com/questions/6438048/css-problem-link-positionabsolute-above-a-box-not-work-in-ie-opera/6438212#6438212 –

+0

sory、私はいくつかの情報を忘れてしまいました。編集した後、あなたが提案した解決策は私のためにはうまくいかないでしょう... – Gatekeeper

+0

doctypeをHTML5に切り替えるつもりはありますか? – tw16

答えて

5

私には解決策があります。 HTML5ではタグの内側に<div>のタグを使用すると有効です。しかし、あなたの言語を変更することはできませんし、HTML4.01はブロックの要素を許可していません<a>私はを偽造それを示唆しています。つまり、タグの内側に<span>を使用して、<div>として動作するようにスタイルします。ここでは実施例である:http://jsfiddle.net/DzpjT/11/

HTML:

<body> 
    <a href="http://www.google.com"> 
     <span class="fakediv">Annoying text la lallalalalalalalalal</span> 
     <span class="fakediv">Annoying text la lallalalalalalalalal</span> 
    </a> 
</body> 

CSS:

a{ 
    display: block; 
    width:700px; 
    height:500px; 
    margin: 10px; 
    background-color: lightblue; 
    color: black; 
    text-decoration: none; 
} 
span.fakediv{ 
    float:left; 
    clear: both; 
    display: block; 
    margin: 10px 20px; 
    cursor: pointer; 
} 
+0

これは面白いアイデアです、明日に試してみて、私からいくつかのポイントを得るように見えます:-)おかげで – Gatekeeper

+0

クール、それは働いた! – Gatekeeper

1

のようなJavascriptを避けたいのではありませんこの:

<a href="http://www.google.com/" style="display:block;position:absolute; width:100%; height:100%; top:0; left: 0; z-index: 10;"></a> 

今すぐ正常に動作するはずです。アンカータグに表示ブロックを追加しました。これはdivのように振る舞います。

+0

申し訳ありませんが、私はdiv内のいくつかのコンテンツでいくつかの他のdivを持っている必要があることを忘れていますので、タグはブロックされていませんでしたオプション... – Gatekeeper

1

brenjtのように、CSSに高さ属性を追加するだけでいいと思います。彼は他のものもそこに投げ込んだが、それはすべていいですが、私の経験では、これはしばしばあなたのCSSに高さが設定されていないからです。

+0

どの要素ですか? divは500pxの高さを持ち、スパンはそのdivsの高さの100%を持っています – Gatekeeper

+0

申し訳ありませんが、私は十分に具体的ではありませんでした。パーセンテージではなく、スパンの高さをピクセルに変更してみてください。 – mountaingirl

+0

ちょうど試しましたが、これは助けになるケースではありません...試していただきありがとうございます – Gatekeeper

0

私はこの同じ問題を抱えていたが、私はカバーしようとしていたコンテンツは見出していたので私は段落と見出しを不必要に模倣するためにCSSクラスを嘲笑することに躊躇し始めました。

問題をデバッグしているうちに、タグに背景色を追加しました。これは明らかに、タグがDOM内のコンテンツを完全にカバーしていたことを示していました。全エリアをクリック可能でした。背景色を削除するとすぐに、テキストの上にカーソルを置いてカーソルを挿入アイコンに変換し、クリックを登録しませんでした。

私は既にIEでカスタムフォントを修正するためにページに透明な1ngのPNGを使用していたので、これをaタグの背景イメージとして設定しました。

これは機能します。

関連する問題