JS background CSS funkcije
Svi znamo šta se definiše background HTML atributom, tako da nije teško
shvatiti šta će se definisati JavaScript background funkcijom. Ajde tabelarno da
vidimo sve vrednosti koje može imati ova funkcija.
JS Funkcija |
Objašnjenje |
Vrednosti |
Objašnjenje vrednosti |
E |
F |
O |
background |
Definisanje boje pozadine |
red |
ime boje, blue, black ... |
4 |
1 |
9 |
rgb(232,123,54) |
RGB boja |
#AB3C23 |
Heksadecimalni zapis |
Definisanje slike pozadine |
url(URL) |
URL adresa slike pozadine |
Definiše kako će slika pozadine ispunjavati
površinu elementa |
repeat |
Ponavljaće se i po vertikali i po horizontali
da ispuni površinu elementa |
repeat-x |
Ponavljaće se po horizontali dok ne ispuni
širinu elementa |
repeat-y |
Po vertikali |
no-repeat |
Neće se ponavljati. Pojaviće se na početku
elementa jednom |
Ponašanje pozadine prilikom skrolovanja |
scroll |
Pomeraće se |
fixed |
Biće fiksna |
Početni položaj slike pozadine |
top left |
gornja leva pozicija |
4 |
Ne |
Ne |
top center |
gornja centralna |
top right |
gornja desna |
center left |
centralna leva |
center center |
centralna centralna |
center right |
centralna desna |
bottom left |
donja leva |
bottom center |
donja centralna |
bottom right |
donja desna |
X% Y% |
Procentualna pozicija u odnosu na veličinu
polja elementa |
Xpos Ypos |
Pozicija u pikselima, ili ostalim CSS
veličinama |
Primer background funkcije:
<html><head>
<script type="text/javascript">
function stil(){
document.body.style.background = "#FFCC80
url(jsslikeplanete/zemlja.jpg) repeat-y";
}
</script></head><body>
<input type="button" onclick="stil()" value="Podesi novi stil pozadine">
</body></html>