• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

question-closed Jak poprawnie dodać mouseover na divie

VPS Starter Arubacloud
0 głosów
197 wizyt
pytanie zadane 15 marca 2021 w JavaScript przez Dawid89 Obywatel (1,100 p.)
zamknięte 15 marca 2021 przez ScriptyChris

Mam kilka divów, w każdym tekst ma display:none. Chciałbym aby po najechaniu na konkretnego diva wyświetlił się jego tekst. Niestety nie działa to, nie ma żadnej reakcji i w konsoli też żadnego błędu. Jak wrzucę sobie console.log to wyświetla co trzeba po każdym najechaniu na element więc sama funkcja mouseover działa ale reszta już nie. Dodawałem też event i to samo....

css:

.box-wrapper .single-box-text: display:none;

html:

<a href="#">
<div class="box-wrapper">
<p class="box-title"></p>
<div class="box-content box-one">
  <div class="single-box-text">
    <p></p>
    <p></p>
    <p></p>
  </div>
</div>
</div>
</a>

js:

$(".box-wrapper").mouseover(()=>{
console.log('test');
$(this).find(".box-content .single-box-text").css("display","block");
	});

próba z eventem:

const element = document.querySelector(".box-wrapper");

element.addEventListener("mouseover", event => {
  console.log("Mouse in");
  $(this).find(".box-content .single-box-text").css("display","block");
});

element.addEventListener("mouseout", event => {
  console.log("Mouse out");
  $(this).find(".box-content .single-box-text").css("display","none");
});

 

komentarz zamknięcia: Problem rozwiązany w komentarzu.
1
komentarz 15 marca 2021 przez lateM Pasjonat (17,660 p.)
To początek jakiegoś większego planu, czy tylko chcesz ukrywać i wyświetlać treść? Bo sam CSS wystarczy (hover z display), nie musisz używać jQuery.
komentarz 15 marca 2021 przez Dawid89 Obywatel (1,100 p.)

Chcę tylko ukryć/wyświetlić po najechaniu.

Piszesz o czymś takim?

.box-wrapper .single-box-text: 
   display:none;
.box-wrapper:hover + .single-box-text:
   display:block;

 To też mi nie działa

komentarz 15 marca 2021 przez Dawid89 Obywatel (1,100 p.)
Już sobie sam odpowiedziałem... bez '+'  działa.

Dzięki za pomoc :)

Podobne pytania

0 głosów
1 odpowiedź 144 wizyt
pytanie zadane 7 listopada 2018 w JavaScript przez Jestem_Szaleńcem Użytkownik (530 p.)
+1 głos
1 odpowiedź 195 wizyt
pytanie zadane 4 listopada 2017 w JavaScript przez lastavenger Obywatel (1,060 p.)
0 głosów
0 odpowiedzi 258 wizyt
pytanie zadane 24 października 2017 w JavaScript przez Riddick Bywalec (2,600 p.)

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...