修复了 IE7/8 中使用 msDropDown jQuery 精灵的问题?
我正在使用 msDropDown jQuery 插件 将图像添加到我网站上的下拉列表中,使用他们的 Sprited选项。在所有经过测试的 Chrome、Firefox 和 IE9 版本中一切都运行良好。然而,退回到 IE7 或 IE8 就会破坏一切。它仍然几乎有效,因为所有选择元素都获得了正确的图像。然而,“标题”选项中的图像永远不会改变(例如,当您未打开下拉菜单时显示的图像)。它始终显示最上面的精灵。
我会注意到这个问题似乎存在于 作者的 css 上-版本演示。到底出了什么问题导致早期版本的 IE 无法运行?如何解决?
I am using the msDropDown jQuery plugin to add images to dropdowns on my site, using their Sprited option. Everything works great in all tested versions of Chrome, Firefox, and IE9. Stepping back to IE7 or IE8, however, breaks things. It still almost works, in that all of the selection elements get the right images. However, the image in the "title" option never changes (e.g. the one that is displayed when you do not have the dropdown open). It always displays the topmost sprite.
I'll note that this problem appears to be present on the author's css-version demo. What is going wrong to stop earlier versions from IE from working? How can it be fixed?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
我以前见过这个问题,通常与
position:relative;
在 IE 中搞乱有关。话虽这么说,我在作者的示例中没有看到任何内容,但看到了问题。这是我能找到的所有内容 http://www.codingforums.com /archive/index.php/t-173790.html 但除了确认我所看到的问题之外没有太多帮助。
我注意到的唯一一件事是该示例没有使用
title="
但插件的文档引用了它正在使用。relative/image.loc"
也许检查一下并尝试添加 title 属性以查看是否有效。因为它是 IE,所以只是提出想法。
调试 IE 时,我通常求助于 Firebug Lite (http://getfirebug.com/firebuglite) 来提供一些帮助 。
可能对你有帮助 但 IE 令人沮丧,所以我想我至少会尝试一下。
I've seen this issue before and often has to do with
position: relative;
mucking things up in IE. That being said, I didn't see any of that in the author example but see the issue.Here is all I could find on it http://www.codingforums.com/archive/index.php/t-173790.html but isn't much help other than confirms the issues I've seen.
The only other thing that I notice is that the example doesn't utilize the
title="
but the documentation for the plugin references it being used.relative/image.loc"
Maybe check that and try to add the title attribute to see if that works. Just shooting ideas out since it is IE.
When debugging IE, I usually resort to Firebug Lite (http://getfirebug.com/firebuglite) to give a little bit of help where possible. Might help you here.
Not much help from me but IE is frustrating so I figure I'd at least try.
在作者网站的评论中,我和另一位用户来来回回,似乎他已经发现了问题。它还没有完全解决,但应该会带来一些解决方案。
他发布了有关正在发生的事情的详细信息,但基本上可以归结为不一致不同版本的 IE 在解释
background-position: XPx Ypx;
与background-position-x: XPx; 时的表现如何background-position-y: Ypx;
最初,我认为添加一些外部 JS 来处理这种差异应该可以解决问题。然而,这失败了,因为我可以附加的所有事件都是在 MS DropDown 插件执行中间的某个位置执行的。
相反,我直接修改了插件。我缩小了尺寸,然后进行了更改,然后重新缩小了。测试证实现在一切正常。我已经在 gitHub 上分叉了 MS DropDown 存储库 并更新了 我的新版本。
In the comments thread on the author's site, another user and I were going back and forth and it seems that he has found the problem. It isn't wholely solved, but it should lead to some solutions.
He posted details about what is going on but basically it comes down to an inconsistency in how different versions of IE behave where it comes to interpretting
background-position: Xpx Ypx;
vsbackground-position-x: Xpx; background-position-y: Ypx;
Initially, I thought that adding some external JS to handle this difference should solve the issue. That failed, however, because all of the events that I could attach to were executed somewhere in the middle of the MS DropDown plugin execution.
Instead, I made direct modification to the plugin. I de-minified, then made my changes, then re-minified. Testing confirms that everything is working properly now. I have forked the MS DropDown repo on gitHub and updated with my new version.