代码之家 › 专栏 › 技术社区 › Phorden

IE10-链接在转换后的div上不可单击

css-transforms internet-explorer-10 css-transitions css html

Phorden · 技术社区 · 11 年前

我对IE 10中的div可点击有问题。他们有CSS3过渡和转换。它们的动画设置正确,但链接不可单击。这在IE 11、FF和Chrome中正常工作。锚点在IE9及以下版本中也不起作用,但CSS转换也不起。我对为什么这在IE 10中不起作用感到困惑。

我不会在这里发布CSS,因为它相当长。我添加了一个用于查看完整css的小提琴。

html格式:

<div class="grid">
    <figure class="effect-bubba columns large-4">
        <img alt="" src="http://www.blackduckmn.com/_images/home/blackduck-minnesota-apple.JPG" />
        <figcaption>
             <h2>Lodging &amp; Dining</h2>

             <p>Whatever you're looking for, Blackduck has a variety of lodging and dining options available!</p> <a href="/visit/lodging-and-dining">View more</a>

        </figcaption>
    </figure>
</div>

JS小提琴: http://jsfiddle.net/phorden/oysn4rgv/

实时页面: http://www.blackduckmn.com/

1 回复 | 直到 11 年前

Community Mohan Dere 9 年前

这似乎是IE中的一个bug,其中锚元素需要背景才能填充空间并最终可单击。尝试在锚标记的规则中添加假背景。

.grid figure a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0px;
    opacity: 0;
    display: block;
    z-index: 100000;

   background: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRââAA7") 0 0 repeat;
}

查看以下问题答案下方的最高评分评论: absolute positioned anchor tag (with no text) not clickable in IE

推荐文章

Luckkks · 过渡色工作不正常

1 年前

BogisW · CSS动画按钮/悬停时为span内容文本添加CSS转换

2 年前

markisawesome4 · 按钮:当您将鼠标移离按钮时,悬停时显示的内容下移后

2 年前

Bruno Oliveira · 如何在CSS转换完成后调用函数-React

2 年前

Ancross · 为什么我的小CSS动画不会触发?

3 年前

Jorge · :before和:after伪元素以接收过渡效果

8 年前

Arsalan Khattak · 线性渐变过渡

8 年前

Albert qerimi · 将鼠标悬停在具有CSS变换比例的div上后添加动画

8 年前

Paul · 悬停时变换比例不缩放

8 年前

Willem van der Veen · CSS转换结合JS clickEvent

8 年前