My website has a unique feature that can detect if you are using the Chrome browser, and it works flawlessly.
The coding for this detection is as follows -
var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
if(isChrome){
alert("Chrome is detected");
}
Another element on the site is a transparent full-page pop-up message. It currently requires clicking an HTML button to activate, but I want to trigger it with JavaScript in the line alert("Chrome is detected");. Here is the code for this element...
<!DOCTYPE html>
<head>
<style>
.button{ width: 150px; padding: 10px; background-color: #FF8C00; box-shadow: -8px 8px 10px 3px rgba(0,0,0,0.2); font-weight:bold; text-decoration:none;
}
#cover{ position:fixed; top:0; left:0; background:rgba(0,0,0,0.6); z-index:5; width:100%; height:100%; display:none;
}
#loginScreen{ height:380px; width:340px; margin:0 auto; position:relative; z-index:10; display:none; background-color: white; no-repeat; border:5px solid #cccccc; border-radius:10px;
}
#loginScreen:target, #loginScreen:target + #cover{ display:block; opacity:2;
}
.cancel{ display:block; position:absolute; top:3px; right:2px; background:rgb(245,245,245); color:black; height:32px; width:32px; font-size:30px; text-decoration:none; text-align:center; font-weight:bold; border-radius:36px;
}
</style>
</head>
<body>
<div id="top" align="center">
<!-- PAY ATTENTION TO THE LINE BELOW -->
<a href="#loginScreen" class="button" id="thebutton">Click here to Log In</a> <!-- THIS TRIGGERS THE POP UP BUT I WANT TO DO THIS WITH JAVASCRIPT -->
</div>
<div id="loginScreen">
<span style="font-size:30px">Attention User!</span>
<a href="#" class="cancel" id="exitbutton">×</a>
</div>
<div id="cover" ></div>
</body>
</html>
Your assistance is greatly appreciated!