-5

Is there any way of changing the CSS of an element if another element is displayed as 'block' using pure JavaScript?

Sorry probably should have said, the display of the element is dependent on whether a button is pressed.

So button press, element1 = display: block; and element2 = opacity: 0.2; When element1 = display: none; element2 = opacity 1;

Timbo
  • 1
  • 2
  • 1
    research following topics: how to check if element display is block, how to change element css programmatically with javascript. – diynevala Mar 09 '18 at 12:29

2 Answers2

0

Yes there is you can get the style by using

<!DOCTYPE html>
<html>

<body>
    <div id="divid" style="color:red;">
        Test
    </div>
<script>
test();
    function test() {
    var color = document.getElementById("divid").style.color;

        if(color == "red") {
            document.getElementById("divid").style.color = "green";
        }
    }
</script>
</body>
</html>
Rvdrichard
  • 335
  • 3
  • 12
0
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Test</title>
<style>
    #myDiv{
        display:none;
    } 
</style>
<script>
    var elem = document.getElementById("myDiv");
    var newElem = document.getElementById("newDiv");
    if(elem.offsetWidth == 0 && elem.offsetHeight == 0){
        newElem.style.color = "red";
    }else{
        newElem.style.color = "green";
    }
</script>
</head>
<body>
    <div id="myDiv">Test</div>
    <div id="newDiv">Test</div>
</body>
</html>