將網站修改爲黑白界面

使用grayscale.js ,將網站界面修改黑色頁面效果。接到需求後,嘗試網站的一些辦法,但是不支持IE瀏覽器。後續利用grayscale.js並在該文件後面添加判斷IE瀏覽器,js動態創建style樣式。希望有所幫助。

 var navStr = navigator.userAgent.toLowerCase();
    if(navStr.indexOf("msie 10.0")!==-1||navStr.indexOf("rv:11.0")!==-1){ // 判斷是IE10或者IE11
        grayscale(document.body);
        grayscale(document.getElementsByTagName("img"));
        document.getElementsByTagName('body')[0].className = 'bodyGrey'; //加類名
    }

var style = document.createElement("style");
   style.type = "text/css";
   style.innerHTML="body {filter:gray;filter: grayscale(100%);-webkit-filter:grayscale(100%);filter:gray;filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)}"
   style.id="addStyle"
  document.getElementsByTagName("HEAD").item(0).appendChild(style);     
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章