使用JS时,IE中不应用转换前缀。它仅使用不带前缀的转换

时间:2018-10-17 20:56:46

标签: javascript jquery reactjs css3

  $('#scrollContent').addEventListener('scroll', () => {
            let translate = 'translate(0,' + $('#scrollContent').scrollTop + 'px)';
            if (timer !== null) {
                clearTimeout(timer);
            }
            timer = setTimeout(function () {
                $('thead').css({ 'transform': translate, '-webkit-transform': translate, '-moz-transform': translate, '-ms-transform': translate, '-o-transform': translate });
            }, 150);
        }, false);
#scrollContent{

height:150px;
overflow:auto;}
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='scrollContent' ref='scrollContent'><table >
<thead>
  <th><td>name</td></th>
  <th><td>age</td></th>
  <th><td>Dob</td></th>
  <th><td>address</td></th>
<thead>
<tbody>
<tr>
  <td>suresh</td>
  <td>21,</td>
  <td>2010</td>
  <td>hyderabad</td>
</tr>

<tr>
  <td>suresh</td>
  <td>21,</td>
  <td>2010</td>
  <td>hyderabad</td>
</tr>

<tr>
  <td>suresh</td>
  <td>21,</td>
  <td>2010</td>
  <td>hyderabad</td>
</tr>

<tr>
  <td>suresh</td>
  <td>21,</td>
  <td>2010</td>
  <td>hyderabad</td>
</tr>

<tr>
  <td>suresh</td>
  <td>21,</td>
  <td>2010</td>
  <td>hyderabad</td>
</tr>
<tr>
  <td>suresh</td>
  <td>21,</td>
  <td>2010</td>
  <td>hyderabad</td>
</tr>

<tr>
  <td>suresh</td>
  <td>21,</td>
  <td>2010</td>
  <td>hyderabad</td>
</tr>

<tr>
  <td>suresh</td>
  <td>21,</td>
  <td>2010</td>
  <td>hyderabad</td>
</tr>

<tr>
  <td>suresh</td>
  <td>21,</td>
  <td>2010</td>
  <td>hyderabad</td>
</tr>

<tr>
  <td>suresh</td>
  <td>21,</td>
  <td>2010</td>
  <td>hyderabad</td>
</tr>

</tbody>
</table>
</div>

转换前缀在IE中不适用。它仅使用不带前缀的转换。

我正在处理react应用程序中的滚动事件。基于滚动位置,我需要将变换样式应用于表标题以使其固定在某个位置。但是转换不能在IE中使用。下面给出的代码只是出于理解的目的。我正在使用ref将事件侦听器添加到选择器。

0 个答案:

没有答案
相关问题