Отключить переход, если скрипты отключены?

-4

Я создал переход в JavaScript, который работает следующим образом:Отключить переход, если скрипты отключены?

document.getElementById("container").style.opacity = "1";

и в CSS:

#container { 
opacity: 0; 
transition: opacity 2s; 
}

Но теперь я установил NoScript и содержимое веб-сайта не показывают, потому что скрипт не мог работать. Могу ли я сделать что-нибудь против этого?

источник

2016-01-19 TheJustJoined

Ничего себе, вы установили ** NoScript ** и задаетесь вопросом, почему Java ** Script ** больше не работает? –

Нет, я хочу знать, могу ли я «проверить», если JavaScript отключен ... – TheJustJoined

Ваша голова, потому что в ваших поисках нет никакого реального расследования, а также на самом деле не объясняет обстоятельства вашей проблемы. Конечно, очевидно, что ваш '# container' не будет отображаться, если у вас нет Javascript, потому что это то, что показывает ваш элемент' # container', и почему он должен либо исчезать, либо почему вы не Хотите Javascript? – JoeP

Если содержание не отображается, когда JavaScript отключен, то вы должны удалить opacity: 0; из вашего CSS, и пусть JavaScript инициализировать его, например:

// we first hide the content using JS 
// the content will be hidden *only and only if* JavaScript is enabled 
document.getElementById('container').style.opacity = '0'; 

// we display the element after some delay or user interaction 
setTimeout(function(){ 
    document.getElementById('container').style.opacity = '1'; 
}, 3000);

Это лучшее ИМХО решение.

В качестве альтернативы, вы можете сделать что-то вроде этого:

<html> 
    <head> 
     //... 

     <style> 
     .no-js #container { 
      opacity: 1; 
     } 
     .js #container { 
      opacity: 0; 
      transition: opacity 2s; 
     } 
     </style> 
    </head> 
    <body class="no-js"> 
     <div id="container">your content</div> 
     //... 
     <script> 
      document.body.classList.remove('no-js'); 
      document.body.classList.add('js'); 
     </script> 
    </body> 
</html>

Вы используете CSS class на body элемент, который указывает, включен ли JavaScript или нет, и стиль вашего контента соответственно.

Эта вторая техника очень эффективна, но будьте осторожны, чтобы не было слишком много .no-js xxx или .js xxx Селекторы CSS, так как это может негативно отразиться на производительности рендеринга веб-сайта, уменьшить лирику CSS и усложнить его ремонтопригодность.

источник

2016-01-19 15:43:31 pomeh

Отключить переход, если скрипты отключены?

ответ

Смежные вопросы