Dan808 Posted April 15, 2020 Share Posted April 15, 2020 Hey, I'm new to CSS and trying to figure something out. I want to have my search bar so when the user clicks it, the entire page fades except for the search bar. So although the bar itself doesn't change, it creates the effect of it being highlighted. If anyone could point me in the right direction that would be great! Thanks Dan Link to comment Share on other sites More sharing options...
Vishal_N Posted April 17, 2020 Share Posted April 17, 2020 Like This way https://codepen.io/vishalneswankar/pen/jObqGxO Link to comment Share on other sites More sharing options...
Ingolme Posted April 17, 2020 Share Posted April 17, 2020 1 hour ago, Vishal_N said: Like This way https://codepen.io/vishalneswankar/pen/jObqGxO The request was that the page fades out when the user focuses the search bar but the search bar remains visible. Your code just covers the whole page with black when the user clicks a button. Link to comment Share on other sites More sharing options...
Vishal_N Posted April 17, 2020 Share Posted April 17, 2020 3 hours ago, Ingolme said: The request was that the page fades out when the user focuses the search bar but the search bar remains visible. Your code just covers the whole page with black when the user clicks a button. Fixed Link to comment Share on other sites More sharing options...
Dan808 Posted April 17, 2020 Author Share Posted April 17, 2020 10 hours ago, Vishal_N said: Like This way https://codepen.io/vishalneswankar/pen/jObqGxO Thanks, just like this, but with the fade happening when the user enters/exits the search box (not when the button is pressed) Link to comment Share on other sites More sharing options...
dsonesuk Posted April 17, 2020 Share Posted April 17, 2020 https://www.w3schools.com/code/tryit.asp?filename=GDXBXPZB02SZ Link to comment Share on other sites More sharing options...
Vishal_N Posted April 18, 2020 Share Posted April 18, 2020 14 hours ago, Dan808 said: Thanks, just like this, but with the fade happening when the user enters/exits the search box (not when the button is pressed) https://codepen.io/vishalneswankar/pen/jObqGxO Ok with input focus kindly check same url Link to comment Share on other sites More sharing options...
Dan808 Posted April 18, 2020 Author Share Posted April 18, 2020 11 hours ago, Vishal_N said: https://codepen.io/vishalneswankar/pen/jObqGxO Ok with input focus kindly check same url Perfect. @dsonesuk Your also works great. Thanks to both of you! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now