Avaleht
uus teema   vasta Tarkvara »  Programmeerimine »  DIV suurus dünaamiliselt javascriptiga märgi kõik teemad loetuks
märgi mitteloetuks
vaata eelmist teemat :: vaata järgmist teemat
Hinnavaatlus :: Foorum :: Uudised :: Ärifoorumid :: HV F1 ennustusvõistlus :: Pangalink :: Telekavad :: HV toote otsing
autor
sõnum Saada viide sõbrale.  :: Teata moderaatorile teata moderaatorile
otsing:  
kpihus
Kreisi kasutaja
kpihus

liitunud: 14.04.2003




sõnum 07.04.2011 11:24:47 DIV suurus dünaamiliselt javascriptiga vasta tsitaadiga

Lähteülesanne: kaks kõrvuti asetsevat DIV'i peavad olema sama kõrgusega, kusjuures vasakpoolse div'i kõrgus müütub vastavalt seal kuvatavale sisule.

Kuna 100% kõrgusega DIV'i tegemine on komplitseeriutd, siis üritasin seda lahendada javascriptiga:

<script language="javascript">
<!--
var divh;
divh = document.getElementById('content_cell_fp').offsetHeight;
divh = divh - 110;
document.write ('<div id = "blog_content" style = "height:' + divh  + 'px;">')
//-->
</script>


Tulemus on see, et firefoxis on kõik paigas, aga näiteks chromes on "blog_content" mõnikümmend pixlit väiksem.
Milles on kühvel ?
Kommentaarid: 26 loe/lisa Kasutajad arvavad:  :: 0 :: 1 :: 25
tagasi üles
vaata kasutaja infot saada privaatsõnum mine selle kasutaja kodulehele
Vermon
Kreisi kasutaja
Vermon

liitunud: 04.12.2003




sõnum 06.05.2011 01:02:11 vasta tsitaadiga

Tekita näiteks jsbin.com lehel sarnane olukord ja sheeri linki, saab paremini probleemile otsa vaadata.
Muide tihti mõnda JS libraryt kasutades kaovad ära brauseritega seotud erinevused.

Nt jQueryga võiks teha nii: $("#blog_content').height($('#content_cell_fp').height());

PS. language="javascript" on deprecated
Kommentaarid: 14 loe/lisa Kasutajad arvavad:  :: 1 :: 0 :: 12
tagasi üles
vaata kasutaja infot saada privaatsõnum
Renka
HV Guru
Renka

liitunud: 01.04.2002




sõnum 06.05.2011 11:23:07 vasta tsitaadiga

Mul tekib siinkohal aga hoopis kaks küsimust:

1. miks on seda vaja - kui mu eeldus on õige siis ei ole sul seda JS üldse vaja. Saab hoopis muudmoodi lahendada.
2. miks JS on pandud HTMLi väljastama?

_________________
There is no place like 127.0.0.1
Kommentaarid: 71 loe/lisa Kasutajad arvavad:  :: 2 :: 1 :: 61
tagasi üles
vaata kasutaja infot saada privaatsõnum mine selle kasutaja kodulehele
Traf
Kreisi kasutaja

liitunud: 04.12.2007




sõnum 06.05.2011 11:30:43 vasta tsitaadiga

Tõepoolest; JS oleks selle jaoks kerge overkill. Natuke kavalam CSS ja töötab ka, ma usun. Aga anna veidike rohkem infot enne.
Kommentaarid: 49 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 48
tagasi üles
vaata kasutaja infot saada privaatsõnum
kpihus
Kreisi kasutaja
kpihus

liitunud: 14.04.2003




sõnum 06.05.2011 12:07:51 vasta tsitaadiga

Traf kirjutas:
Tõepoolest; JS oleks selle jaoks kerge overkill. Natuke kavalam CSS ja töötab ka, ma usun. Aga anna veidike rohkem infot enne.


Ok, aga kuidas, kõik info on esimeses postituses, kui midagi täpsemalt tarvis, siis küsi.
Kommentaarid: 26 loe/lisa Kasutajad arvavad:  :: 0 :: 1 :: 25
tagasi üles
vaata kasutaja infot saada privaatsõnum mine selle kasutaja kodulehele
Renka
HV Guru
Renka

liitunud: 01.04.2002




sõnum 06.05.2011 13:27:48 vasta tsitaadiga

kpihus, ei ole ju infot, et mille jaoks sul seda vaja on. Samuti ei ole näidist.

Ma usun, et sa tahad tekitada miski lehe layouti tulpadega. Sellisel juhul ei ole vaja sul divide kõrgustega mängima hakata. Lahenduse leiad "faux columns" nime alt.

_________________
There is no place like 127.0.0.1
Kommentaarid: 71 loe/lisa Kasutajad arvavad:  :: 2 :: 1 :: 61
tagasi üles
vaata kasutaja infot saada privaatsõnum mine selle kasutaja kodulehele
kpihus
Kreisi kasutaja
kpihus

liitunud: 14.04.2003




sõnum 06.05.2011 15:05:07 vasta tsitaadiga

Renka kirjutas:
kpihus, ei ole ju infot, et mille jaoks sul seda vaja on. Samuti ei ole näidist.

Ma usun, et sa tahad tekitada miski lehe layouti tulpadega. Sellisel juhul ei ole vaja sul divide kõrgustega mängima hakata. Lahenduse leiad "faux columns" nime alt.


Jah näidist ei ole. On kaks divi. Ühe (vasakpoolse sees) kuvatakse blogi postitusi. Tolle divi kõrgus on vastavalt postituste arvule ja sisu pikkusele erinev. Parem poolse alumine serv peab olema vaskpoolsega tasa. height 100% ei tööta. Ausalt öeldes ei olegi päris täpselt aru saanud, kuidas 100% Div height töötab. Nagu ma googeldades olen leidnud, siis peaks ka kõik parentid olema 100% kõrgusega, et see toimiks, kas see info vastab tõele. igaljuhul javascripti nöol leidsin suhteliselt ainsa lahenduse. Nagu ma loomkatsetest järeldasin, siis chrome millegipärast tõlgendab divi kõrgust teisiti. Igastahes lõpuks lahendasasin asja selliselt, et javascripti kontrollib mis browseriga on tegu, ning vastavalt sellele määrab offseti.

Üritan mingi lihtsa näite tekitada, siis saab edasi vaadata.

Parandage, kui ma eksin, aga faux columns mind ei aita, kuna selle kõnealuse parempoolse divi taust on CSS gradient.
Kommentaarid: 26 loe/lisa Kasutajad arvavad:  :: 0 :: 1 :: 25
tagasi üles
vaata kasutaja infot saada privaatsõnum mine selle kasutaja kodulehele
andrusny
Kreisi kasutaja
andrusny

liitunud: 20.03.2006




sõnum 06.05.2011 21:11:21 vasta tsitaadiga

document.write ('<div id = "blog_content" style = "height:' + divh  + 'px;">')


selle asemel oleks vist õigem teha html osasse

<div id = "blog_content" ></div>


ja JS osasse

var blog_content = document.getElementById('blog_content');
blog_content.style.height=divh+'px';

_________________
Kommentaarid: 7 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 7
tagasi üles
vaata kasutaja infot saada privaatsõnum mine selle kasutaja kodulehele
19Mart94
HV kasutaja

liitunud: 22.06.2010



Autoriseeritud ID-kaardiga

sõnum 08.05.2011 16:35:00 vasta tsitaadiga

Old School but works (Muidugi pead endale natukene muutma seda):


<table style="border-bottom: 1px solid red">
<tr valign="top">
<td>
<div align="left">vasak<br>vasak<br>vasak</div>
</td>
<td>
<div align="left">parem<br>parem<br>parem<br>parem<br>parem</div>
</td>
</tr>


Töötab ka siis, kui kasutajal JS off thumbs_up.gif
Kommentaarid: 33 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 31
tagasi üles
vaata kasutaja infot saada privaatsõnum
näita postitusi alates eelmisest:   
uus teema   vasta Tarkvara »  Programmeerimine »  DIV suurus dünaamiliselt javascriptiga
[vaata eelmist teemat] [vaata järgmist teemat]
 lisa lemmikuks
näita foorumit:  
 ignoreeri teemat 
sa ei või postitada uusi teemasid siia foorumisse
sa ei või vastata selle foorumi teemadele
sa ei või muuta oma postitusi selles foorumis
sa ei või kustutada oma postitusi selles foorumis
sa ei või vastata küsitlustele selles foorumis
sa ei saa lisada manuseid selles foorumis
sa võid manuseid alla laadida selles foorumis



Hinnavaatlus ei vastuta foorumis tehtud postituste eest.