jQuery 不更改 Internet Explorer 中的类或 CSS
我有一个图像幻灯片,其顶部有一个用于广告文案的小 DIV。每次幻灯片发生变化时,广告框都会淡出,然后新的广告框会在不同的位置淡入。
这在除 IE 之外的所有浏览器中都适用。我所有的 jQuery 动画都工作正常,但由于某种原因,该框不会改变位置。 .css() 更改我的上/左值和实际使用 .attr() 更改类在 IE 中均失败。
这是更改类并显示框的 JS。第一行只是从文件名(image-6.jpg)获取位置。
var heroPosition = vars.currentImage.attr('src').substr(-5, 1);
switch(heroPosition) {
case "1":
$('#hero-ad').attr('class','hero-position-1');
break;
case "2":
$('#hero-ad').attr('class','hero-position-2');
break;
case "3":
$('#hero-ad').attr('class','hero-position-3');
break;
case "4":
$('#hero-ad').attr('class','hero-position-4');
break;
case "5":
$('#hero-ad').attr('class','hero-position-5');
break;
case "6":
$('#hero-ad').attr('class','hero-position-6');
break;
}
$('#hero-ad').show("fold", {}, 1000);
代码本身有点被侵入 Nivo 图像滑块。
实时站点在这里 http://www.sugarloaf.com/slredesignlocal/index.html
大部分JS在js/plugins.js中。位置的 CSS 位于 css/style.css
编辑 我应该提到我尝试使用 .addClass() 和 .removeClass() 并且此方法也失败了。
I have an image slideshow, which has a small DIV on top of it for ad copy. Every time the slide changes, the ad box fades out, and a new one fades in, in a different position.
This works great in every browser but IE. All of my jQuery animations are working fine, but for some reason the box won't change position. Both .css() to change my top/left values and actually changing the class using .attr() fail in IE.
Here is the JS to change the class, and show the box. The first line simply gets the position from the filename (image-6.jpg).
var heroPosition = vars.currentImage.attr('src').substr(-5, 1);
switch(heroPosition) {
case "1":
$('#hero-ad').attr('class','hero-position-1');
break;
case "2":
$('#hero-ad').attr('class','hero-position-2');
break;
case "3":
$('#hero-ad').attr('class','hero-position-3');
break;
case "4":
$('#hero-ad').attr('class','hero-position-4');
break;
case "5":
$('#hero-ad').attr('class','hero-position-5');
break;
case "6":
$('#hero-ad').attr('class','hero-position-6');
break;
}
$('#hero-ad').show("fold", {}, 1000);
The code itself was sort of hacked into the Nivo image slider.
The live site is here http://www.sugarloaf.com/slredesignlocal/index.html
Most of the JS in js/plugins.js. CSS for the positions is in css/style.css
EDIT I should mention that I tried using .addClass() and .removeClass() and this method also failed.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我猜你在 IE 中特别遇到这个问题,因为你使用的是带有负数的
substr()
。查看这篇文章 。您应该考虑使用slice()
来获取您期望的值。I'm guessing you are having this problem specifically in IE because you are using
substr()
with a negative number. Check out this post. You should consider usingslice()
instead to get the value you're expecting.使用
.addClass( className )
更改 css 类。例如,
根据 IE 版本的不同,
class
可能不是有效的属性。Use
.addClass( className )
to change css classes.e.g.
Depending on version of IE,
class
may not be a valid attribute.如果您想替换类而不仅仅是添加新类,请尝试此操作。
Try this if you want to replace the class and not just add new class.