#Need help changing the visibilty property of my div element[IMPORTANT]

6 messages · Page 1 of 1 (latest)

viscid baneBOT
#

@opaque remnant

File Attachments Not Allowed

For safety reasons we do not allow files with certain file extensions.

devlop_gaming Said

I have a div element and gave it a class. I made it invisible by setting it's css property visibility to hidden in my style.css file. I need to make it visible when the LaunchWebMeet button is clicked. I don't know how to check a div visibility in javascript. Can someone help me? This is important.

Code Formatting

You can share your code using triple backticks like this:
```
YOUR CODE
```

Large Portions of Code

For longer scripts use Hastebin or GitHub Gists and share the link here

Ignored these files due to them having disallowed file extensions
  • index.html
  • index.js
  • style.css
opaque remnant
# 
let LaunchWebMeet = document.getElementById("LaunchWebMeet")
let drop_down = document.getElementsByClassName("drop-down")

LaunchWebMeet.addEventListener("click",LaunchWebMeetDropMenuVisible)

function LaunchWebMeetDropMenuVisible(){
    if (LaunchWebMeet.parentElement.checkVisibility() == false){
        drop_down.visibility = "visible"
    }
}
# 
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>WebMeet</title>
        <link rel="stylesheet" href="style.css">
        <link rel="icon" href="Images/Icon.png">
    </head>

    <body>
        <div id="Box">
            <img id="WebMeetIcon" src="Images/Icon.png">
            <b><h2 id="PageTitle">WebMeet</h2></b>
            <button id="LaunchWebMeet" type="button">Launch Web Meet</button>
            <div class="drop-down">
                <ul>
                    <li id="login-li"><button id="login">Login</button></li>
                    <li id="sign-up-li"><button id="sign-up">Sign Up</button></li>
                </ul>
            </div>
        </div>
        <script src="index.js"></script>
    </body>
</html>
#

I have a div element wich i gave a class. I set it's visibilty property to hidden in my css file. I need to make it visible when the LaunchWebMeet button has been clicked. How do i do this?

cedar crystal
#

@opaque remnant either put the visibility property inside the element style attribute and change with JS, or add 2 CSS classes like

.div-visible { visibility: visible; }
.div-hidden { visibility: hidden; }
#

and change class using JS