1

我正在使用基于 CSS 的方法来裁剪图像以适应特定的纵横比。在后端，我访问图像的高度和宽度，并根据图像与其被裁剪到的空间之间的纵横比差异，将图像绝对定位在 span-wrapper 中。后端代码与我在这里的关注无关，但前端代码的工作方式如下：

<a href="some-link-url">
    <span class="croppedImageWrapper" style="height:115px;width:115px;" title="(Some title)">
    <img src="some-url-for-img-with-aspect-ratio=1.36" style="height:100%;top:0px;left:-28px;" />
    </span>
</a>

.croppedImageWrapper {
    display:inline-block;
    position: relative;
    overflow: hidden;  
}

.croppedImageWrapper img {
    position: absolute;
}

它适用于我需要支持的所有浏览器，除了 IE7：当我.croppedImageWrapper在链接中放置 a 时，它似乎掩盖了链接，使其无法点击。我一直在用 jQuery 中的一个简单检查来处理这个问题：

if ($.browser.msie && parseInt($.browser.version, 10) == 7)

...然后我可以将点击事件附加到跨度，获取其父链接的 href 并重定向。但是现在我已经升级到 jQuery 1.9.1，这不再有效——$.browser不赞成使用特征检测。

*所以我的问题是：*

如何使用功能（错误）检测来发现这个错误？还是我只需要破解 IE 版本检测器？

4

1 回答 1

1

我在我的一个项目中使用了它，它是 $.browser 的简单替代品，而无需包含整个 jQuery Migrate 脚本。

http://pupunzi.open-lab.com/2013/01/16/jquery-1-9-is-out-and-browser-has-been-removed-a-fast-workaround/

jQuery.browser = {};
jQuery.browser.mozilla = /mozilla/.test(navigator.userAgent.toLowerCase()) && !/webkit/.test(navigator.userAgent.toLowerCase());
jQuery.browser.webkit = /webkit/.test(navigator.userAgent.toLowerCase());
jQuery.browser.opera = /opera/.test(navigator.userAgent.toLowerCase());
jQuery.browser.msie = /msie/.test(navigator.userAgent.toLowerCase());

您还需要结合使用它：

navigator.appVersion
于 2013-05-22T08:34:37.037 回答