Kirjautuminen

Haku

Tehtävät

Keskustelu: Nettisivujen teko: Miten koodataan sivuille scrollbar aina olevaksi?

Sivun loppuun

Minka [15.02.2008 15:48:20]

#

Elikkä ongelmana on se, että IE:ssä tuo scrollbarhan on aina olemassa, vaikkakin in-aktiivisena, mutta Mozillan tuliketussa se tulee näkyviin vasta, kun sivuilla on jotain joka menee muutoin näyttöalueen yli.

Ongelmaksi tämä muodostuu minulle siksi, että olen sovittanut sivut keskelle selainta ja nyt kun jollain alasivulla on scrollauksen tarve, nytkähtää sivu vasemmalle hieman (scrollbarin verran) tuliketussa, koska scrollbar tunkee mukaan kuvaan vieden hieman pikseleitä oikeasta laidasta.

Onko olemassa mitään koodin pätkää, jolla vois Mozillankin pakottaa pitämään aina scrollbarin näkyvissä (vaikka sitten inaktiivisena)? Ei millään viitsis lyödä joka sivulle tyhjääkään, kun sitten kävijät scrollailee turhaan etsiäkseen jotain alhaalta, mitä siellä ei ole.

Mulla on CSS-tyylit sivuilla käytössä, joten se olisi tietty mieluisin tapa niin ei tarttis kaikkia sivuja puukottaa.

Dude [15.02.2008 16:15:40]

#

Näin se taitaa hoitua:

body{
overflow: scroll;
}

Minka [15.02.2008 22:15:02]

#

Tolla sain skulaamaan nätisti tuolla tuliketussa, mutta nyt sitten tuli tuonne IE-puolelle myös se ala scrollbar ja lisäksi toinen scrollbar siihen sivullekin, joista en niin hirmuisesti välittäisi...

Olisiko ideoita, jolla sais sen pois IE:stä siten, että sivu palkki olisi kuitenkin edelleen tuliketussa?

Dude [15.02.2008 22:52:11]

#

<!--[if !IE]>--><div id="scrollbar">
...
</div><!--<![endif]-->
#scrollbar{
overflow: scroll;
}

Tuo alkuosa heti body-tagin jälkeen ja sitte sisältö.

Merri [17.02.2008 14:29:11]

#

Tässä luullakseni täydellinen "emulointi":

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fi">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<title></title>
		<!--[if gt IE 6]><!--><style type="text/css">
html { overflow : scroll; overflow-x : auto; }
body { overflow : visible; }
		</style><!--<![endif]-->
	</head>
	<body>
		<h1>overflow</h1>
		<p>Iih!</p>
	</body>
</html>

Opera ei tainnut vielä tukea overflow-x:ää ja overflow-y:tä, joten sillä sitten tulee alaskin vierityspalkki. IE7 vetää tämän oikein, vanhemmat IE:t pitää jättää pois kun niissä vierityspalkkipuoli on toteutettu ihan päin ties mitä: ilmeisesti html ja body jakavat saman vierityspalkin.

Minka [18.02.2008 18:20:14]

#

Vaikuttaisi toimivan... Ei tota sais millään tuonne CSS:ään koodatuksi, kun en laiskuuttani viitsisi millään jokaisen sivun koodia puukottaa. On nimittäin ihan kiitettävästi tuota scriptiä yms. tuossa alussa jo muutenkin, jolloin virheen mahdollisuus kasvaa..

Jatkan nyt tuolla periaatteella ja jos tulee vinkkejä CSS:n osalta muutellaan sitten...

Kiitoksia!

Merri [18.02.2008 19:22:31]

#

Mikäli palveluntarjoaja tukee .shtml eli SSI-sivuja, niin kannattaa tehdä sivujen alku- ja loppuosa niillä. Tai vielä parempaa jos PHP-tuki löytyy. Ei tarvitse toistaa samaa mahdollisesti muuttuvaa koodia uudelleen niin paljon.

reca [18.02.2008 20:04:59]

#

Eikös homma luonnistu myös laittamalla
body ja html tageille 101% korkeus.

html,body{
height: 101%;
}

Sivun alkuun

Vastaus

Aihe on jo aika vanha, joten et voi enää vastata siihen.

Tietoa sivustosta