jQuery 不更改 Internet Explorer 中的类或 CSS

发布于 2024-11-27 04:02:26 字数 1142 浏览 0 评论 0原文

我有一个图像幻灯片,其顶部有一个用于广告文案的小 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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

我只土不豪 2024-12-04 04:02:26

我猜你在 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 using slice() instead to get the value you're expecting.

许一世地老天荒 2024-12-04 04:02:26

使用 .addClass( className ) 更改 css 类。

例如,

$('#hero-ad').addClass('hero-position-1')

根据 IE 版本的不同,class 可能不是有效的属性。

Use .addClass( className ) to change css classes.

e.g.

$('#hero-ad').addClass('hero-position-1')

Depending on version of IE, class may not be a valid attribute.

半夏半凉 2024-12-04 04:02:26

如果您想替换类而不仅仅是添加新类,请尝试此操作。

$('#hero-ad')[0].className = 'hero-position-1';

Try this if you want to replace the class and not just add new class.

$('#hero-ad')[0].className = 'hero-position-1';
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文