| Autor | Zpráva | ||
|---|---|---|---|
| Tomáš123 Profil |
#1 · Zasláno: 12. 7. 2016, 16:24:52
Ahoj diskusia, inšpiroval som sa výpisom komentárov na hlavnej stránke jecasu.cz, kde je zvyšok komentáru schovaný za prechod. Chcel by som ale namiesto tlačidla odkazujúceho na celý obsah, komentár, použiť rolovanie, pričom, kým by bolo kam pokračovať, prechod by zahmlieval časť obsahu. Prechod by mal byť schopný zotrvať napoziciovaný na dolnej hrane a nemal by prekrývať rolovaciu lištu ani sa prekrytiu vyhýbať statickým odsadením (nie všetky rolovacie lišty sú rovnako široké), pričom výška obsahu nie je známa.
Ide toto riešiť v čistom CSS, ide vytvoriť obmedzujúci blok pre fixne poziciovaný prvok, poznáte nejakú elegantnú náhradu, hack? Sám som došiel k tomu, že na to, aby mohol byť nejaký prvok prilepený ku dnu absolútnou pozíciou, musí mať jeho rodič, okrem relatívnej pozície, výšku a overflow iný ako visible, pričom hidden kvôli odstrihnutiu nevyhovuje. V takom prípade ide vytvoriť situáciu, keď je zahmlievací prvok funkčný, ale prekrýva posuvník.
Chamurappi pred pár rokmi riešil niečo vzdialene príbuzné. Str4wberry vtedy uvažoval podobne. Škoda, že je ho príspevok ostal bez odozvy. Ďakujem pekne za odpovede. |
||
| Fisir Profil |
#2 · Zasláno: 12. 7. 2016, 17:24:28
Reaguji na Tomáše123:
Kam mé znalosti sahají, tak to přes CSS řešit nejde. Osobně bych se ale přestal štítit JavaScriptu jako čert kříže a prostě si to odsazení od scrollbaru spočítal. |
||
| Chamurappi Profil |
#3 · Zasláno: 12. 7. 2016, 18:15:20
Reaguji na Fisira:
„Osobně bych se ale přestal štítit JavaScriptu jako čert kříže a prostě si to odsazení od scrollbaru spočítal.“ To je zbytečně složité, ne? Nestačí tomu tlačítku prostě přidat posuvník a ten zneviditelnit? Krom toho getElementsByClassName má horší podporu než querySelectorAll. A změřit šířku posuvníku jde také trochu jednodušeji…
|
||
| Tomáš123 Profil |
Fisir:
Ďakujem za riešenie. Chamurappi: Vlastne mi napadlo niečo podobné. Keďže výšku prechodu poznám, môžem celý element presunúť pod prvok s rolovacou lištou a relatívne ho napoziciovať na spodnú hranu. Aby sa šírky elementov vyrovnali, pridám aj rodičovi prechodu overflow: scroll a znížim jeho výšku na 0.
Problém tkvie v tom, že vo vnorenom prvku s overflowom iným ako visible sa prvok mimo obrysy rodiča vôbec nezobrazí. Škoda, zdalo sa mi to pekné.
|
||
| Tomáš123 Profil |
#5 · Zasláno: 13. 7. 2016, 01:09:55
Chamurappi:
Tvoju ukážku som si zobrazil až teraz. Spojenie zneviditeľniť posuvník na mňa spolu s ostatnými poznámkami ku Fisirovmu kódu pôsobilo príliš JavaScriptovo... Lepšie riešenie už nehľadám. Ďakujem. |
||
| Fisir Profil |
#6 · Zasláno: 13. 7. 2016, 11:10:00
Reaguji na Chamurappiho:
„změřit šířku posuvníku jde také trochu jednodušeji“ (Daný kousek kódu je ze StackOverflow, není to můj výmysl.) A neprozradil bys jak, prosím? |
||
| Chamurappi Profil |
#7 · Zasláno: 13. 7. 2016, 13:43:36
Reaguji na Fisira:
Před pár lety jsem napsal něco takového. Reaguji na Tomáše123: Na vlastnost visibility se často zapomíná, většina lidí si zpravidla v začátcích pomyslí „aha, to je jen horší obdoba display: none“, a na ten užitečný efekt, že potomek neviditelného může být zpátky zviditelněný, navždy zapomenou.
„Problém tkvie v tom, že vo vnorenom prvku s overflowom iným ako visible sa prvok mimo obrysy rodiča vôbec nezobrazí“
Tohle mě také občas štve. On je obecně vztah pozicování a overflow trochu nedomyšlený.
|
||
|
Časová prodleva: 8 let
|
|||
0