NOVINKA: Kurz kybernetické bezpečnosti s akreditací MŠMT, nyní již od 0 Kč. Staň se žádaným profesionálem. Zjisti více:
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Neaktivní uživatel:21.11.2019 15:11

Dobrý den, mám web a na něm je sidebar který je přes plnou výšku ale menší problém byl že obsah je dynamický tudíž sidebar měl dole mezeru když byl obsah větší jak "jedna obrazovka", to jsem vyřešil tak že jsem si javascriptem vzal výšku celého webu a potom se změnil sidebar height na požadovanou výšku, to bylo dočasné řešení, ale problém je v tom že bych to potřeboval docílit aby to bylo opravdu 100% respektive když mám textareu (tinymce) a má povolený resize, tak když si dám resize dolu tak sidebar už zůstane, viz. screen

Odpovědět
21.11.2019 15:11
Neaktivní uživatelský účet
Avatar
Neaktivní uživatel
Člen
Avatar
Neaktivní uživatel:21.11.2019 18:47

Nestačí position: fixed a height: 100vh?

Nahoru Odpovědět
21.11.2019 18:47
Neaktivní uživatelský účet
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Neaktivní uživatel:21.11.2019 19:01

Nechci aby to bylo fixed jelikož později bude více položek v menu a nechci aby to bylo na scrollování

Nahoru Odpovědět
21.11.2019 19:01
Neaktivní uživatelský účet
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:21.11.2019 21:42

Ja bych pouzil bootstrap. Vyuzil jeho 100% a dovnitr dal ten TinyMce tez na 100%.
Nevim, zda to uz css umi, ale kdysi se na height pouzival JS.
Muzes pouzit overflow, kdyz nesches scrolovani.

 
Nahoru Odpovědět
21.11.2019 21:42
Avatar
Neaktivní uživatel
Člen
Avatar
Odpovídá na Neaktivní uživatel
Neaktivní uživatel:21.11.2019 21:44

A min-height?

Teda jestli jsem pochopil správně, že chceš sidebar scrollovat se stránkou.

Nahoru Odpovědět
21.11.2019 21:44
Neaktivní uživatelský účet
Avatar
Neaktivní uživatel
Člen
Avatar
Neaktivní uživatel:21.11.2019 21:48

Ještě pak můžeš zkusit max(100%, 100vh).

Nahoru Odpovědět
21.11.2019 21:48
Neaktivní uživatelský účet
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Neaktivní uživatel:22.11.2019 5:53

Ano chci scrollovat, ale jelikož je obsah dynamický tak když je obsah větší jako 100% tak sidebar nejde úplně dolu, proto jsem právě zkoušel přes ten javascript aby se vždy dorovnalo výška sidebaru podle výšky stránky ale funguje to jen na začátku ale když potom použiju tu textareu na resize tak se to zase rozpadne

Nahoru Odpovědět
22.11.2019 5:53
Neaktivní uživatelský účet
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:22.11.2019 8:10

Ja bych udelal jiny trik. Odebral bych class vlevo, ktera definuje styly sloupce a vsem ostatnim bych nastavil display:none class. Cili, nejdriv docilit pozadovaneho bez layoutu a pak layout nejak odstranit.
V tuto chvili mas layout a snazis se ho nejak prebijet.
Urcite by prvek, kteremu nastavujes 100% height nemel mit v sobe padding a kolem margin. Mozna bych mu vnutil pro jistotu 1px ramecek barvou pozadi, aby marginy nevytekaly.
Se 100% height si ted prave nejsem jisty, jak to resi nove prohlizece, css3. Ale u tech starych bylo treba nastavit html, body, #idecko {margin:0; padding:0; height:100%}, protoze tam height omezovalo height body a to zas omezoval html tag. Slo o to docilit cross-browser.

https://www.jakpsatweb.cz/…ednotky.html
https://www.jakpsatweb.cz/…y/index.html#… = nejake prikladz na vzstredeni, tam musi se 100% height pracovat

https://www.jakpsatweb.cz/css/height.html
Pokud potřebujete nějaký prvek mít stejně vysoký, jako je šířka okna (například čtvercový obrázek), použijte jednotku vw.

 
Nahoru Odpovědět
22.11.2019 8:10
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:22.11.2019 8:13

Jo, podle mne je uzitecne mit u editoru tlacitko na rychle prepnuti Code. casto editor nema filtraci kodu a je mozne kod pridat nebo nekdy je nutne odebirat word formatovani. To vetsinou resim externe pres Far nebo Pspad.

 
Nahoru Odpovědět
22.11.2019 8:13
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Neaktivní uživatel:22.11.2019 11:58

Já právě používám height: 100vh; ale já potřebuji aby výška sidebaru byla vždy stejně velká jako celá stránka, i v tu chvíli když budu resizovat ten editor a bude se mi stránka prodlužovat, tak aby se v tu chvíli prodloužil i ten sidebar, proto jsem hledal řešení přes javascript ale fungovalo to tak že jen po načtení stránky se height nastavil na výšku celé stránky ale po resize sidebar už zůstal stát. Proto když normálně přijdu na stránku tak sidebar je v pohodě, tak jak to potřebuji ale po resize se to už neprodlouží.

Nahoru Odpovědět
22.11.2019 11:58
Neaktivní uživatelský účet
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Neaktivní uživatel:22.11.2019 12:43

A nebo aby dokud byl v sidebaru obsah tak se to scrollovalo a potom by to bylo fixed

Nahoru Odpovědět
22.11.2019 12:43
Neaktivní uživatelský účet
Avatar
Neaktivní uživatel
Člen
Avatar
Neaktivní uživatel:22.11.2019 15:30

Mohl bys sem dát odkaz na ten web, ať to mám kde vyzkoušet, než sem začnu psát haldu možných řešení?

Nahoru Odpovědět
22.11.2019 15:30
Neaktivní uživatelský účet
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:22.11.2019 15:31

Chces mit 2 sloupce stejne vysoke, ne? display:table-row, table-cell
Ten bootstrap to taky umi.
google = 2 sloupce stejne vysoke

Js by mohl fungovat nejak takto. Kazit to muzou marginy a padingy, tak na ty bacha.

function prepocitej_vysky()
{
var $, a, b, ha, hb;
$ = document.querySelector.bind(document);
a = $('#a');
b = $('#b');
ha = a.offsetHeight;
hb = b.offsetHeight;
if (hb>ha) {a.offsetHeight = hb + 'px'; return;}
if (ha>hb) {b.offsetHeight = ha + 'px'; return;}
}
// onclick = "nastav_vysku(); prepocitej_vysky();"
 
Nahoru Odpovědět
22.11.2019 15:31
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:22.11.2019 15:50

Podle mne to funguje naprosto bezvadne. Asi mas problem ve tvem nezverejnem kodu :)

https://jsfiddle.net/e0gp9d38/

<style>
#a, #b, #c {display:table-cell; width: 300px; border:2px solid #f80; }
#c {display:table-row;}
#b {left: 350px; top:-1px;}
</style>


<div id="d">
    <div id="a"></div>
    <div id="b">
        <span onclick="nastav_vysku(-20);">-20</span> |
        <span onclick="nastav_vysku(+20);">+20</span>
    </div>
</div>


<script>
function prepocitej_vysky()
{
var a, b, ha, hb;
a  = $('#a');
b  = $('#b');
ha = a.offsetHeight;
hb = b.offsetHeight;
a.innerHTML = [ha, hb].join(',');
if (hb>ha) {a.style.height = hb + 'px'; return;}
if (ha>hb) {b.style.height = ha + 'px'; return;}
}

function nastav_vysku(diff)
{
var b, hb;
b  = $('#b');
hb = b.offsetHeight;
hb += diff;
b.style.height = hb + 'px';
prepocitej_vysky();
}

var $ = document.querySelector.bind(document);
prepocitej_vysky();
</script>
 
Nahoru Odpovědět
22.11.2019 15:50
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na Peter Mlich
Neaktivní uživatel:22.11.2019 15:56

Nevím, jak bych to do toho kódu aplikoval, mám šablonu kterou jsem nedělal já, odkaz na web zde: http://velkysenov.8u.cz/, vím že je takhle blbé někomu pomáhat.

Editováno
Nahoru Odpovědět
22.11.2019 15:56
Neaktivní uživatelský účet
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Neaktivní uživatel:24.11.2019 9:06

Problém už jsem vyřešil, bylo to tím že tinymce si načte až po všem tu textareu tudíž se nastavoval špatná výška sidebaru.

Editováno
Nahoru Odpovědět
24.11.2019 9:06
Neaktivní uživatelský účet
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 16 zpráv z 16.