| Autor | Zpráva | ||
|---|---|---|---|
| ForestCZE Profil |
Zdravím, mám tuto ukázku. Když najedu myší na rám tabletu, sníží se opacity, když z něj sjedu, opacity se vrátí, což je v pořádku. Potřeboval bych ale, aby to reagovalo pouze na ten rám, tj. když se budu myší pohybovat po displeji (černý prostor), aby opacity zůstalo nezměněné. Tuším, že se nějak musí na ty vnořené elementy provést
preventDefault() nebo stopPropagation(), ale nedaří se mi. Jak na to, prosím?
|
||
| Kcko Profil |
#2 · Zasláno: 31. 12. 2021, 18:36:43
ForestCZE:
Na to nepotřebujes JS ne? Stačí Ti CSS a když to chceš dělat přes JS tak Ti stačí přes event kontrolovat target a na jakém jsi elementu. |
||
| ForestCZE Profil |
#3 · Zasláno: 31. 12. 2021, 21:34:28
Kcko:
No v CSS by to šlo takto, ale stále je ten problém, že to reaguje na vnořené elementy. |
||
| Kcko Profil |
#4 · Zasláno: 1. 1. 2022, 22:21:38
ForestCZE:
Na který element to má reagovat? |
||
| tttttttttttt Profil * |
#5 · Zasláno: 1. 1. 2022, 22:34:13
Kcko:
Rozumím tomu tak, že při najetí na .tablet-container se mu má nastavit opacity, při najetí na potomka .tablet-content se má opacity vrátit na výchozí hodnotu. V CSS to není jednoduché (možné?). Po najetí na potomka je potřeba změnit opacity rodiče, což myslím nejde.
ForestCZE: Pokud bys ten horní pruh udělal taky jako potomka, bude to jednodušší. Jinak JS musíš odchytit mouseenter na .tablet-content a změnit v něm opacity .tablet-container.
|
||
| ForestCZE Profil |
#6 · Zasláno: 1. 1. 2022, 23:13:58
tttttttttttt:
„Pokud bys ten horní pruh udělal taky jako potomka, bude to jednodušší. Jinak JS musíš odchytit mouseenter na .tablet-content a změnit v něm opacity .tablet-container.“
To bohužel nedělá to, co potřebuji. Pokud udělám to, co jsi napsal, tak se mi tablet více zprůhlední po najetí na displej tabletu, což je nežádoucí. Zkusím to popsat ještě jednou. Mám otevřený tablet ve hře, ve kterém je nějaká HTML stránka a vyplňuji tam například inputy, takže provádím něco v .tablet-content elementu. A najednou se rozhodnu, že chci vidět, co se kolem mě děje, tak najedu myší na ten rám .tablet-container a chci snížit opacity, abych viděl, co je za tabletem a pak se rozhodnu zase pokračovat, tak sjedu z toho rámu a mám opět opacity na full. Je to možné?
|
||
| tttttttttttt Profil * |
#7 · Zasláno: 1. 1. 2022, 23:22:15
Jen jsem to nedobře popsal.
* po najetí na .tablet-container nastavíš .tablet-container na průhledný
* po najetí na .tablet-content nastavíš .tablet-container na neprůhledný
Tím by ten efekt měl být jen na rámečku. |
||
| ForestCZE Profil |
tttttttttttt:
Jestli jsem to pochopil správně, tak by to mělo být takto. Snažím se ještě přijít na jeden nežádoucí efekt a to ten, že se to provede pouze jednou a víckrát ne, dokud nesjedu myší až na .background
Je potřeba to ještě nějak překombit víc? EDIT: Je to zbytečně složité. Opravím jeden efekt a rozbije se druhý. Nakonec jsem to udělal jednoduše: $(".tablet-container").mouseenter(function() {
$(this).css("opacity", 1)
}).mouseleave(function() {
$(this).css("opacity", 0.3)
}) |
||
|
Časová prodleva: 2 roky
|
|||
0