Check if an element is being clicked with Javascript

Asked

Viewed 63 times

-5

Abstracting: I don’t know about Javascript, but I know I can do what I want with Javascript. I would like to know how to check if an input is being clicked, and when it is, I would like to add css classes to other page elements.

How do I do that?

javascript
  • 1

    I found something that can help you: https://www.w3schools.com/jsref/event_onclick.asp

  • Will it be a single field? Or several?

  • I want to click the input and add a background to the site

  • Example: <input type="number" onclick="myFunction()">

  • Your question is not clear in more detail than you want more exactly.

  • I specifically want the effect that occurs when clicking on the https://www.shoptime.com.br/ search box where the background darkens

  • Using the direct function call of the html <input onchange="function()"> is not appropriate. The most appropriate is to make javascript wait for event object.onclick = Function(){ its code};

Show 2 more comments

1 answer

0


Vc can use a pseudo element in div who has a input inside, as with the focus-within vc show or not the pseudo element that covers the entire site underneath. Nor need JS for this

inserir a descrição da imagem aqui

div:focus-within::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 1
}
.foca {
  position: relative;
  z-index: 2;
}
<div class="pesquisa">
  <input class="foca" type="text">
</div>


<div>
  Lorem ipsum dolor sit amet consectetur adipisicing elit. Unde sequi architecto fugiat, voluptas deleniti debitis harum, rem est voluptates minima facere neque quis ullam asperiores ab necessitatibus nostrum porro velit!
</div>

Browser other questions tagged javascript

You are not signed in. Login or sign up in order to post.