让IE支持Css3属性(圆角、阴影、渐变)

☆樱花仙子☆ 提交于 2020-03-30 18:10:08

>>>>>>>>>>>>>>>>>>>>>>>>>>>

蕃薯耀 2015年11月20日 10:35:10 星期五

http://fanshuyao.iteye.com/

 

项目下载地址及Demo:http://css3pie.com/

相关文档:http://css3pie.com/documentation/​

相关文章:http://www.zhangxinxu.com/wordpress/?p=967​

 

css3pie有三种处理方式,一种是使用htc文件,一种是使用js文件,一种是针对php使用php加载htc文件的。

 

第一种需要加上Content-type,但有些服务器默认不支持,还需要修改服务器的配置文件,好像挺麻烦的。

 

第二种最好,只是使用js(推荐使用)

使用js的优势:

Advantages of the JS version

Since it is a normal .js file, PIE.js does not suffer from some of the more annoying limitations of the PIE.htc behavior:

  • You can load PIE.js from a different domain than the HTML page.
  • You don't have to worry about your server not using the correct Content-type header for the file.
  • Referencing the PIE.js file via a relative path is simpler since you only have to do it once in each HTML page.
  • It is more easily integrated within JavaScript libraries.

第三种不说了。​

 

第二种(js)使用方法:​

官方文档:http://css3pie.com/documentation/pie-js/

Using PIE.js

If you've decided the above advantages outweigh the disadvantages for you, here's how you go about using PIE.js.

  1. Include the PIE.js script in your page, surrounded by a conditional comment to prevent it from being downloaded in other browsers:
    <!--[if IE]>
    <script type="text/javascript" src="path/to/PIE.js"></script>
    <![endif]-->
    Note: The code above is for PIE.js 1.0; if you are using a PIE 2.0 beta build, then you will need to include the appropriate JS file for the current IE version:
    <!--[if lt IE 9]>
      <script type="text/javascript" src="path/to/PIE_IE678.js"></script>
    <![endif]-->
    <!--[if IE 9]>
      <script type="text/javascript" src="path/to/PIE_IE9.js"></script>
    <![endif]-->
  2. Invoke the PIE.attach(el) function for each element that needs CSS3 styling. Make sure you do this after the page's DOM has been fully loaded. For example, using jQuery:
    $(function() {
        if (window.PIE) {
            $('.rounded').each(function() {
                PIE.attach(this);
            });
        }
    });

If you are going to add new elements to the page via JavaScript after the fact, you will have to make sure your JS code calls PIE.attach(el) for each new element that needs CSS3 styling. Calling attach for a particular element more than once is safe (PIE will ignore the call if the element has already been attached), so you don't need to worry about filtering out elements.

Also, if you remove elements from the page that had PIE attached, you will need to call PIE.detach(el) to clean up their CSS3 rendering.

 

​自己使用的:

之前加载PIE.js文件​

<!--[if IE]>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/PIE.js"></script>
<![endif]-->

 

if (window.PIE) {
        $('.css3,.form-control').each(function() {
            PIE.attach(this);
        });
}

 

​附件为PIE文件

 

 

>>>>>>>>>>>>>>>>>>>>>>>>>>>

蕃薯耀 2015年11月20日 10:35:10 星期五

http://fanshuyao.iteye.com/

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!