Conditional in attribute value

would it be possible that the attribute of a tag can have a specific value depending if JS is endabled or disabled…can a conditional be written to accommodate this???

For example I have the body tag and depending if JS is enabled or disabled I want it to have a hidden attribute.

<body style="visibility:hidden;">

is it possible you think?

Sure! You could just add (or remove) the attribute with JS, so when JS is disabled, nothing will happen anyway. Like

// Hide the body if JS is enabled
document.body.style.visibility = 'hidden'

// Or the other way round
document.body.style.visibility = null

Hi there designtrooper,

wherever possible, I prefer to remove all styling from the javascript. :sunglasses:

<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1">

<title>untitled document</title>

<!--<link rel="stylesheet" href="screen.css" media="screen">-->

<style media="screen">
.hidden {
    visibility:hidden;
 }
</style>

</head>
<body class="hidden"> 

<script>
(function() {
   'use strict';
   document.body.classList.remove('hidden');
}());
</script>

</body>

Further reading:-

Avoid mixing with other technologies

coothead

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.