使用圆角与jquery在ie

我想在我的meny中使用圆角代码跨浏览器翻转效果，但不在ie中工作。我试图使用PIE甚至一些pllugins，但他们没有工作。使用圆角与jquery在ie

这是我的代码：

$("document").ready(function() { 

var ancho = $('nav li.nav_active').width()+24; 

    $('nav li.nav_active').css({ 
      'background-color' : '#282828', 
      "height" : ancho+"px", 
      'margin-top' : "-"+(ancho-48)/2+"px", 
      '-moz-border-radius' : ancho/2+"px", 
      '-webkit-border-radius' : ancho/2+"px", 
      '-khtml-border-radius' : ancho/2+"px", 
      'border-radius' : ancho/2+"px", 
      'behavior' : 'url(../PIE.htc)', 
      '-webkit-box-shadow' : '0 8px 6px -6px black', 
      '-moz-box-shadow' : '0 8px 6px -6px black', 
      'box-shadow' : '0 8px 6px -6px black', 
      'border' : 'none' 
      }); 
      $('nav li.nav_active a').css({ 
      "line-height" : ancho+"px", 
      "color" : "white", 
      "font-family" : "'E-BoldCondensed'", 
      }); 






$(function() { 
    $('nav li:not(.nav_active)').mouseover(
     function() { 
      var ancho = $(this).width()+32; 
      $(this).css({ 
      "height" : ancho+"px", 
      'margin-top' : "-"+(ancho-48)/2+"px", 
      '-moz-border-radius' : ancho/2+"px", 
      '-webkit-border-radius' : ancho/2+"px", 
      '-khtml-border-radius' : ancho/2+"px", 
      'border-radius' : ancho/2+"px", 
      'behavior' : 'url(../PIE.htc)', 
      '-webkit-box-shadow' : '0 8px 6px -6px black', 
      '-moz-box-shadow' : '0 8px 6px -6px black', 
      'box-shadow' : '0 8px 6px -6px black', 
      }); 
      $(this,'a').css({ 
      "line-height" : ancho+"px", 
      }); 
     }); 
}); 

$(function() { 
    $('nav li:not(.nav_active)').mouseleave(
     function() { 

      $(this).css({ 
      "height" : "", 
      'margin-top' : "", 
      '-moz-border-radius' : "", 
      '-webkit-border-radius' : "", 
      '-khtml-border-radius' : "", 
      'border-radius' : "", 
      '-webkit-box-shadow' : '', 
      '-moz-box-shadow' : '', 
      'box-shadow' : '', 

      }); 
      $(this,'a').css({ 
      "line-height" : '', 
      }); 
     }); 
}); 

$(function() { 
    $('nav li').mousedown(
     function() { 
      var ancho = $(this).width()+32; 
      $(this).css({ 
      "height" : ancho+"px", 
      'margin-top' : "-"+(ancho-48)/2+"px", 
      '-moz-border-radius' : ancho/2+"px", 
      '-webkit-border-radius' : ancho/2+"px", 
      '-khtml-border-radius' : ancho/2+"px", 
      'border-radius' : ancho/2+"px", 
      'behavior' : 'url(../PIE.htc)', 
      '-webkit-box-shadow' : '', 
      '-moz-box-shadow' : '', 
      'box-shadow' : '', 
      }); 
      $(this,'a').css({ 
      "line-height" : ancho+"px", 
      }); 
     }); 
}); 

});

这在我的网站的链接：www.miramarlab.com

来源

2012-04-14 Emilio Yero

你为什么不干脆把所有的类，并使用'addClass（）'，而不是'CSS（）'？ – elclanrs 2012-04-14 22:06:36

哪个版本的IE？你有没有尝试静态设置PIE角落，而不是JS？我敢打赌，PIE不支持动态添加的CSS。 – 2012-04-14 22:06:39

我正在使用css（），因为我需要获取li的宽度值才能计算出拐角的半径以制作完美的圆。 – 2012-04-14 22:14:44

你只能和它使用CSS做没有jquery（甚至没有图像）会更好。请阅读这篇文章：http://jonraasch.com/blog/css-rounded-corners-in-all-browsers。希望这会有所帮助。

来源

2012-04-14 22:07:45 kpotehin

你应该调用相对于html页面的htc文件，而不是css。也许这是罪魁祸首，并且htc文件有一个特定的mime类型，应该将其添加到.htaccess文件中。

保存在根目录下的HTC文件，并以绝对路径加载：

behavior: url (http://www.miramarlab.com/PIE.htc);

来源

2012-04-14 22:20:00 undefined

使用圆角与jquery在ie

回答

相关问题