Hinnavaatlus
:: Foorum
:: Uudised
:: Ärifoorumid
:: HV F1 ennustusvõistlus
:: Pangalink
:: Telekavad
:: HV toote otsing
|
|
autor |
|
kpihus
Kreisi kasutaja

liitunud: 14.04.2003
|
07.04.2011 11:24:47
DIV suurus dünaamiliselt javascriptiga |
|
|
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 |
|
 |
Vermon
Kreisi kasutaja

liitunud: 04.12.2003
|
06.05.2011 01:02:11
|
|
|
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 |
|
 |
Renka
HV Guru

liitunud: 01.04.2002
|
06.05.2011 11:23:07
|
|
|
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 |
|
 |
Traf
Kreisi kasutaja
liitunud: 04.12.2007
|
06.05.2011 11:30:43
|
|
|
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 |
|
 |
kpihus
Kreisi kasutaja

liitunud: 14.04.2003
|
06.05.2011 12:07:51
|
|
|
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 |
|
 |
Renka
HV Guru

liitunud: 01.04.2002
|
06.05.2011 13:27:48
|
|
|
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 |
|
 |
kpihus
Kreisi kasutaja

liitunud: 14.04.2003
|
06.05.2011 15:05:07
|
|
|
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 |
|
 |
andrusny
Kreisi kasutaja

liitunud: 20.03.2006
|
06.05.2011 21:11:21
|
|
|
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 |
|
 |
19Mart94
HV kasutaja
liitunud: 22.06.2010
|
08.05.2011 16:35:00
|
|
|
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
|
|
Kommentaarid: 33 loe/lisa |
Kasutajad arvavad: |
   |
:: |
0 :: |
0 :: |
31 |
|
tagasi üles |
|
 |
|
lisa lemmikuks |
|
|
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
|
|