[es] - dinamički promjenjiva širina <input type=text> taga

garrak
krš Dalmacije

Član broj: 114887
Poruke: 40
*.cmu.carnet.hr.

Profil

dinamički promjenjiva širina <input type=text> taga

^{05.09.2007. u 10:39 - pre 202 meseci}

Pozdrav svima!

Dobio sam zadatke na natjecaju za posao.

Prvi sam rijesio ali drugi ne znam. Navescu ovdje oba, drugi je vezan za prvi.

Napominjem da mi treba samo rjesenje drugog zadatka.

1) CSS: napraviti tablicu izgledom što sličniju onoj u MS Excelu koja zauzima sav mogući prostor korisničkog browsera. Svaka ćelija se mora moći editirati. Čelija mijenja boju dok je miš preko nje ili dok je kursor tipkovnice aktivan na njoj. Ne koristiti TABLE već DIV tagove. Pokušajte ne koristiti JavaScript.

2) Zadatak broj 1 s iznimkom takvom da je širina ćelije 70px, visina 22px, a broj ćelija horizontalno i vertikalno se mijenja ovisno o raspoloživim dimenzijama browsera. Nema scrollanja. Širina ćelije se može promijeniti +- 15% i to samo zato da ne bude nedovršenih ćelija na kraju ekrana (primjer: slobodna rezolucija je 1000px. Da ne ostane nedovršena ćelija na desnoj strani, sve ćelije se mijenjaju do 71px). Može se koristiti JavaScript po potrebi.

Hvala na paznji i trudu

Odgovor na temu

noviKorisnik
Dejan Katašić
Novi Sad

Član broj: 13216
Poruke: 4533
195.178.55.*

Sajt: www.novikorisnik.net

+5 Profil

Re: dinamički promjenjiva širina <input type=text> taga

^{05.09.2007. u 11:04 - pre 202 meseci}

Bilo bi lepo da ostaviš svoje rešenje prvog dela, obzirom da su zadaci povezani.

BoxUp
interesantna logička igra
Monty Hall paradoks - interaktivni demo

Odgovor na temu

garrak
krš Dalmacije

Član broj: 114887
Poruke: 40
*.cmu.carnet.hr.

Profil

Re: dinamički promjenjiva širina <input type=text> taga

^{05.09.2007. u 15:39 - pre 202 meseci}

Prvi zadatak, npr. samo 2x2 celije.

<style>
.field, .field input {
background: #eaeaea;
}

.field input {
border: 1px solid #000;
}

.field {
float: left;
}

.field input:hover, .field input:focus {
background: #aeaeae;
}

.clear {
clear: both;
}

</style>

<div>
<div class="field"><input type="text"></div>
<div class="field"><input type="text"></div>
<br class="clear" />
<div class="field"><input type="text"></div>
<div class="field"><input type="text"></div>
<br class="clear" />
</div>

Odgovor na temu

noviKorisnik
Dejan Katašić
Novi Sad

Član broj: 13216
Poruke: 4533
195.178.55.*

Sajt: www.novikorisnik.net

+5 Profil

Re: dinamički promjenjiva širina <input type=text> taga

^{06.09.2007. u 09:55 - pre 202 meseci}

Hm, a pseudo-klasa :hover radi samo na linkovima u IE6, takođe i ova :focus nije od neke koristi. "Pokušajte ne koristiti JavaScript" :-)

A ovo drugo - trebaš širinu i visinu raspoložive površine prozora browsera ... opet pomalo zeznuta stvar jer to baš nije standardizovano kako se meri, no recimo da document.body.clientWidth i document.body.clientHeight daju zadovoljavajuće rezultate.

Potom sledi matematika da vidiš koliko elemenata možeš da smestiš horizontalno a koliko vertikalno, koliku varijaciju veličine ćeš da primeniš na pojedine da se sve to valjano uglavi ... ne zaboravi da postaviš marginu i padding body elementa na nulu ;-)

Takođe, preporuka je da isključiš border s tih inputa, kao i padding, zbog različitog računa širine i visine elemenata kod IE i u standardima.

BoxUp
interesantna logička igra
Monty Hall paradoks - interaktivni demo

Odgovor na temu