Javascript-форум (https://javascript.ru/forum/)
-   Internet Explorer (https://javascript.ru/forum/css-html-internet-explorer/)
-   -   не работает в IE (https://javascript.ru/forum/css-html-internet-explorer/57818-ne-rabotaet-v-ie.html)

galych 21.08.2015 10:52

не работает в IE
 
В других браузерах все гуд(появляются стрелочки вверх и вниз), а вот в IE не работает, хотя консоль не выдает ошибок. подскажите где собака зарыта?
Код:

<!DOCTYPE HTML>
<html>

<head>
  <style>
    body,
    html {
      height: 100%;
      width: 100%;
      padding: 0;
      margin: 0;
    }

    #matrix {
      width: 400px;
      margin: auto;
      overflow: auto;
      text-align: justify;
    }

    #updown {
      height: 9px;
      width: 14px;
      color: green;
      position: fixed;
      top: 10px;
      left: 10px;
      cursor: pointer;
    }

    #updown.up::before {
      content: '▲';
    }

    #updown.down::before {
      content: '▼';
    }
  </style>
  <meta charset="utf-8">
</head>

<body>

  <div id="matrix">
    <script>
      for (var i = 0; i < 2000; i++) document.writeln(i)
    </script>
  </div>

  <div id="updown"></div>

  <script>
    var updownElem = document.getElementById('updown');

    var pageYLabel = 0;

    updownElem.onclick = function() {
      var pageY = window.pageYOffset || document.documentElement.scrollTop;

      switch (this.className) {
        case 'up':
          pageYLabel = pageY;
          window.scrollTo(0, 0);
          this.className = 'down';
          break;

        case 'down':
          window.scrollTo(0, pageYLabel);
          this.className = 'up';
      }

    }

    window.onscroll = function() {
      var pageY = window.pageYOffset || document.documentElement.scrollTop;
      var innerHeight = document.documentElement.clientHeight;

      switch (updownElem.className) {
        case '':
          if (pageY > innerHeight) {
            updownElem.className = 'up';
          }
          break;

        case 'up':
          if (pageY < innerHeight) {
            updownElem.className = '';
          }
          break;

        case 'down':
          if (pageY > innerHeight) {
            updownElem.className = 'up';
          }
          break;

      }
    }
  </script>
</body>

</html>


рони 21.08.2015 11:18

galych,
версия ie?

galych 21.08.2015 15:46

пробовал 8 и 11

Главное в песочнице отрабатывает

ksa 21.08.2015 16:42

Цитата:

Сообщение от galych
Главное в песочнице отрабатывает

Может из-за кодировки... В твоем примере она вообще не указана.

ksa 21.08.2015 16:43

Как тут... :write:
<!DOCTYPE HTML>
<html>

<head>
  <style>
    body,
    html {
      height: 100%;
      width: 100%;
      padding: 0;
      margin: 0;
    }

    #matrix {
      width: 400px;
      margin: auto;
      overflow: auto;
      text-align: justify;
    }

    #updown {
      height: 9px;
      width: 14px;
      color: green;
      position: fixed;
      top: 10px;
      left: 10px;
      cursor: pointer;
    }

    #updown.up::before {
      content: '▲';
    }

    #updown.down::before {
      content: '▼';
    }
  </style>
  <meta charset="utf-8">
</head>

<body>

  <div id="matrix">
    <script>
      for (var i = 0; i < 2000; i++) document.writeln(i)
    </script>
  </div>

  <div id="updown"></div>

  <script>
    var updownElem = document.getElementById('updown');

    var pageYLabel = 0;

    updownElem.onclick = function() {
      var pageY = window.pageYOffset || document.documentElement.scrollTop;

      switch (this.className) {
        case 'up':
          pageYLabel = pageY;
          window.scrollTo(0, 0);
          this.className = 'down';
          break;

        case 'down':
          window.scrollTo(0, pageYLabel);
          this.className = 'up';
      }

    }

    window.onscroll = function() {
      var pageY = window.pageYOffset || document.documentElement.scrollTop;
      var innerHeight = document.documentElement.clientHeight;

      switch (updownElem.className) {
        case '':
          if (pageY > innerHeight) {
            updownElem.className = 'up';
          }
          break;

        case 'up':
          if (pageY < innerHeight) {
            updownElem.className = '';
          }
          break;

        case 'down':
          if (pageY > innerHeight) {
            updownElem.className = 'up';
          }
          break;

      }
    }
  </script>
</body>

</html>

ksa 21.08.2015 16:44

В ИЕ9 стрелку вверх видно... :yes:

galych 21.08.2015 19:39

Цитата:

Сообщение от ksa (Сообщение 385080)
Может из-за кодировки... В твоем примере она вообще не указана.

а это что?
Код:

<meta charset="utf-8">

laimas 23.08.2015 04:42

#updown.up:before {
content: '▲';
}

#updown.down:before {
content: '▼';
}

laimas 23.08.2015 04:44

http://htmlbook.ru/css/before
http://htmlbook.ru/css3/before

galych 24.08.2015 04:15

Цитата:

Сообщение от laimas (Сообщение 385220)
#updown.up:before {
content: '▲';
}

#updown.down:before {
content: '▼';
}

К сожалению не помогло:(


Часовой пояс GMT +3, время: 09:52.