IE常見問題兼容

1:讓低版本IE兼容H5標籤

  解決方案：引入一個插件：html5.js，(除了媒體播放器)，

  項目寫法：

       

1 <!--[if lt IE 10]>
2 
3          <script src="js/html5.js"></script>
4 <![endif]-->

View Code

 

   文件下載地址：https://github.com/awarriorer/compatibilityLowVersionForIE/

 

2：讓低版本IE兼容H5 video視頻播放器

   解決方案：引入一個插件，html5media.min.js同時須要把對應的flash(flowplayer.controls.swf[控制組件], flowplayer.swf[播放器])和js放在同一個目錄。該插件的主要思想，把mp4經過flash插件播放出來。

   文件下載地址：https://github.com/awarriorer/compatibilityLowVersionForIE/

 

3：低版本IE實現Css3圓角

   解決方案：引入插件jquery.corner.js，本插件依託jquery。

   弊端：不能用彩色的底色，只能用白色，(若是打開控制檯會發現，實際上是js生成了好多個div,中間透明，白色的邊。多是我理解的還不到位，也但願知情者指正)

   Js下載地址：https://github.com/awarriorer/compatibilityLowVersionForIE/

   插件調用Api：http://www.zhangxinxu.com/study/201001/jquery-plugin-round-corner.html

 

4：低版本IE支持Css3選擇器，

   解決方案：經過jquery選擇器去彌補吧，略感雞肋

 5：檢測瀏覽器是否支持除css3屬性

// 檢測瀏覽器是否支持一個css3屬性
function supportCss3(style) { 
    var prefix = ['webkit', 'Moz', 'ms', 'o'], 
        i, 
    humpString = [], 
    htmlStyle = document.documentElement.style, 
    
    _toHumb = function (string) { 
        return string.replace(/-(\w)/g, function ($0, $1) { 
        return $1.toUpperCase(); 
        }); 
    }; 
     
    for (i in prefix) 
        humpString.push(_toHumb(prefix[i] + '-' + style)); 
     
        humpString.push(_toHumb(style)); 
     
    for (i in humpString) 
        if (humpString[i] in htmlStyle) return true; 
     
    return false; 
}

 

6：事件綁定方法

 1 //添加監聽事件
 2 function addEvent( obj, type, fn ) { 
 3     if ( obj.attachEvent ) { 
 4         obj['e'+type+fn] = fn; 
 5         obj[type+fn] = function(){obj['e'+type+fn]( window.event );} 
 6         obj.attachEvent( 'on'+type, obj[type+fn] ); 
 7     } else{
 8         obj.addEventListener( type, fn, false ); 
 9     } 
10         
11 } 
12 //移除監聽事件
13 function removeEvent( obj, type, fn ) { 
14     if ( obj.detachEvent ) { 
15         obj.detachEvent( 'on'+type, obj[type+fn] ); 
16         obj[type+fn] = null; 
17     } else {
18         obj.removeEventListener( type, fn, false ); 
19     }
20 }  

View Code

 

待發現，待解決，待更新……