與正負PNG圖像DHTMLX按鈕沒有在IE11瀏覽器工作在窗10

我創建DHTMLX佈局和安裝在that.There dhtmlxform是4個方向按鈕和3 - 加，減，刷新上form.It添加按鈕正如截圖所示，但加號和減號按鈕不能正常工作，如IE11窗口10中的另一個截圖所示。這個問題的解決方案是什麼？與正負PNG圖像DHTMLX按鈕沒有在IE11瀏覽器工作在窗10

  <!DOCTYPE html> 
      <html> 

      <head> 
       <title>Object-based init</title> 
       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> 
       <meta http-equiv="X-UA-Compatible" content="IE=edge"/> 
       <link rel="stylesheet" type="text/css" href="javascript\dhtmlx\dhtmlx_pro_full/dhtmlx.css"/> 
       <script src="javascript\dhtmlx\dhtmlx_pro_full/dhtmlx.js"></script> 


       <style> 


        html,body { 
         overflow: hidden; 
         height:100%; 
         min-height: 100%; 
         margin-top: 0px; 
        } 

        object { 
         height:100% 
        } 

        table { 
         margin: 0px; 
        } 



        div.dhx_toolbar_material div.dhx_toolbar_btn input.dhxtoolbar_input { 
         margin: 4px 4px; 
         padding: 4px 2px 3px 2px; 
        } 

        div.dhxform_obj_material div.dhxform_item_absolute div.dhxform_btn{ 
         height:24px; 
         width:24px; 
         border: thin solid ligthgray; 
         border-radius: 3px; 
         text-align: center; 
        } 


        .dhtmlx_message_area { 
         left:35%; 
         margin-top:200px; 
        } 
       </style> 
      </head> 
      <body> 
         <div id="mainScreen" style="height:100%;width:100%;position:absolute;" > 
          <svg id="diagramLayout" style="height:100%;width:100%;position:absolute;"> 
          </svg> 
          <div id="sample"> 
          <div id="objId1" style="height: 100%"></div> 
          </div> 
         </div> 
         <div id="hidden" style="display:none;"><canvas id='canvas' ></canvas></div> 

         <div id="objId" style="width:100px; height:30px;position:relative;"></div> 


         <script> 

          var graphCell; 


          graphLayout = new dhtmlXLayoutObject("mainScreen", "1C"); 

          graphCell = graphLayout.cells('a'); 

          loadForm(); 
          function loadForm(){ 
           navigationString = [ 
            { type:"button" , name:"up", value:"<img src='images/icons/up-arrow.png' style='position:absolute;width:15px;height:15px;left:4px;top:4px'>", width:"24", height: 24, inputLeft:36, inputTop:-118+window.innerHeight, position:"absolute" }, 
            { type:"button" , name:"down", value:"<img src='images/icons/down-arrow.png' style='position:absolute;width:14px;height:14px;left:4px;top:6px'>", width:"24", inputLeft:36, inputTop:-60+window.innerHeight, position:"absolute" }, 
            { type:"button" , name:"left", value:"<img src='images/icons/left-arrow.png' style='position:absolute;width:14px;height:14px;left:3px;top:5px'>", width:"24", inputLeft:10, inputTop:-89+window.innerHeight, position:"absolute" }, 
            { type:"button" , name:"right", value:"<img src='images/icons/right-arrow.png' style='position:absolute;width:14px;height:14px;left:5px;top:5px'>", width:"24", inputLeft:61, inputTop:-89+window.innerHeight, position:"absolute" }, 
            { type:"button" , name:"add", value:"<img src='images/icons/add.png' style='position:absolute;width:10px;height:10px;top:6px;left:6px'> <span style='margin-left:13px;'></span>",height:"5", width:"24", inputLeft:99, inputTop:-118+window.innerHeight, position:"absolute" }, 
            { type:"button" , name:"refresh", value:"<img src='images/icons/refresh.png' style='position:absolute;width:11px;height:11px;top:6px;left:5px'> <span style='margin-left:13px;'></span>", width:"24", inputLeft:99, inputTop:-89+window.innerHeight, position:"absolute" }, 
            { type:"button" , name:"substract", value:"<img src='images/icons/substract.png' style='position:absolute;width:10px;height:10px;top:6px;left:5px'> <span style='margin-left:13px;'></span>", width:"24", inputLeft:99, inputTop:-60+window.innerHeight, position:"absolute" } 
           ]; 

           navigationForm = new dhtmlXForm("objId", navigationString); 
           } 

         </script> 
      </body> 
      </html>

來源

2017-03-14 user6821214

看起來它與IMG元件的尺寸做和PNG圖像和瀏覽器縮放圖像。從我看到的我看起來像你的圖標上的線條或消失或變得模糊，當他們被放大太多。

你有30x30px圖標並加載這些圖標10px的-14px的IMG元素。這消失的圖標加載到最小IMG元素（10px的寬度高度），如果增加IMG元件的尺寸從10到11像素它們變得可見，這裏是一個演示： http://snippet.dhtmlx.com/0284599ed

作爲一個解決方案，我建議決定的圖像尺寸，並準備相應的圖標，使瀏覽器將不再需要它們進行縮放

來源

2017-03-14 14:51:06

與正負PNG圖像DHTMLX按鈕沒有在IE11瀏覽器工作在窗10

回答

相關問題