<div id="FloatMail" style="position: absolute; background-color: transparent; background-image:url('kuva.gif'); width: 180px; border-width: 0; border-styleutset; border-color:#444444; padding:0px"> Tähän siis pitäisi saada läpinäkyvä tausta ja tuollaista olen epätoivoisesti yrittänyt, kun en ole apua mistään löytänyt. Toinenkin kysymys olisi. Miten saan layerin kellumaan paikallaan ruudun alaosaan nähden. Tavallisesti, jos määritän layerin sijainnin, sen määritys otetaan vasemman yläkulman suhteen. Jos siis jollakin on pienempi näyttö yms, hän ei edes näe koko layeria. Olisi kuitenkin tärkeää, että layer olisi just eikä melkeen näytön/selaimen ruudun alalaidassa. Olisiko jollakin nerolla ideoita?
Onko tuolla kuvalla läpinäkyvyys/alpha kerros/layer? Määrää sen systeemin koon prosentteina, näin se pysyy aina ruudulla.
Neroksi en itteäni tituleeraa, mutta eikös tuo background:transparent; tee läpinäkyvän taustan (ainakin Firefoxilla, miten IE?)? Pilaisiko tuo gif sen läpinäkyvyyden? Esim näin: #FloatMail { position:fixed; bottom:0px; z-index:1; } En tosin ole saanut toimimaan IE:llä... Ja paremmin asiaa tuntevat saavat kommentoida=)
Ei se mokoma kyllä ota toimiakseen... On se kyllä ihme systeemi! Olen kokeillut Ultra Browseria, Avant Browseria ja Internet Exploreria (vältän yleensä käyttämistä = surkea selain). Firefoxilla se näköjään toimii...
Tarkotat siis, että kun vierität sivua alas- tai ylöspäin, niin se "seuraa" siinä mukana? Toi taitaa mennä jo javascriptin puolelle..miten on javascript hallinnassa? =)
Niin. Osaan siis asettaa layerin koordinaatteihin 34,47, mutta eri kokoisella näytöllä ja eri resoluutiolla layer on eri kohdalla. Se ei siis saisi "seurata" niin, että se tulee hieman jäljessä, vaan tulisi olla kuviteltavissa, että kyseinen layer on "liimattu katselijan näyttöön". Teet mitä vain, se on aivan selaimen alareunassa. Ihan sama miten mokoma tehdään, kunhan se tulee tehdyksi! JavaScript ei ole hallinnassa siinä mielessä, että joku sanoo "teeppäs tollanen skripta". Ei kyllä onnistu, mutta jos saan skriptan niin osaan kyllä muokkailla sitä omiin tarkotuksiini sopivaksi.
Läpinäkyvyys vai kellutus? CSS:llä tuo position:fixed; saa elementin "liimautumaan näyttöön", mutta tuki valtaselaimilla taitaa olla niin ja näin=( Javascriptistä minulla ei ole hajuakaan.. Mutta jos javascriptillä onnistut, ota huomioon ettei sekään ole kaikilla käyttäjillä käytössä... Eli huolehdi että myös heillä se juttu näkyy. _X_X_X_X_X_[small] http://www.getfirefox.com/[/small]
Kellutus onnistuu, mutta läpinäkyvyys tuottaa onkelmia. Kiitti. Saan sydeemin "liimautumaan näyttöön", mutta olisiko sinulla jotain neuvoa, että miten minä saisin layerin liimautumaan alas, oli näyttö tai reso mikä tahansa? Ajattelin JavaScriptin heittää niin, että jos selain ei tue JavaScriptiä, selain disabloi koko layerin.
Oletko kokeillut ilman gif-kuvaa, jos vika olisi siinä? bottom:arvo ja yksikkö (esim. bottom:1px) taisi asemoida näytön alareunan mukaan (tjsp) Täällä lisää asemoinnista: http://koti.mbnet.fi/~petepe/css2/asemointi.htm _X_X_X_X_X_[small] http://www.getfirefox.com/[/small]
En oikein ymmärtänyt tuon käyttöä. Kokeilin nimittäin. En tiedä mihin nyt tuon parametrin heittää... Voisitko heittää jonkun esimerkkiskriptan?
No esim. tuossa ekassa viestissäsi on noita tyylimäärittelyitä, vaikka niiden sekaan. Omasta mielestäni parempi vaihtoehto on erillinen tyylitiedosto, joka linkitetään sivuusi <head>-osiossa näin: <link href="tyyli.css" rel="stylesheet" type="text/css"> sitten luot tyyli.css -tiedoston (tavallinen tekstitiedosto, mutta päätteenä .css), ja tässä tapauksessa samaan kansioon sivusi kanssa. href= atribuutissa viitataan tyylitiedoston sijaintiin, eli siihen tarkempaa polkua jos haluat tyylitiedoston eri kansioon. Ilmeisesti sinulla on .htm(l) tiedostossa jotain tällaista: <div id="FloatMail" style="position: absolute; ...jne jne> [sisältöä] </div> vaihda se tällaiseksi: <div id="FloatMail"> [sisältöä] </div> Lisää nyt tyylitiedostoosi (tyyli.css) esim. tuo #FloatMail { background:transparent; /*läpinäkyvä taustaväri*/ border:1px solid black; /*näyttää divin reunat, näet millainen se on*/ position:fixed; /*"liimaa näyttöön"*/ bottom:0px; /*etäisyys ruudun alareunasta*/ z-index:1; /*tason sijainti "korkeussuunnassa, 0 on alimmainen*/ } näin FloatMail -div:iin linkittyy nuo tyylimääritykset. Ja jos et hoksaa jutun juonta, jatka ajatuksella täältä: http://koti.mbnet.fi/~petepe/css1/cssinfo/csshtml.htm#External