KOMPOOS.NL

scrollbar left - CSS

home » manuals » css » scrollbar-left.html

sitemap


voorbeeld voor scrollbar links

scrollbar boven

Als jouw browser de left-scrollbar procedure ondersteunt zal het resultaat duidelijk zijn. Voor diégenen, waar de browser geen scrollbar aan de linkerkant heeft geplaatst, een korte uitleg. De hieronderstaande stylesheet en de dáár-onder geplaatse html-code zorgen er voor dat (mits er browser-support is) de scrollbar aan de linkerkant getoond zal worden. Om er zeker van te zijn dat de scrollbar zal verschijnen, staat hieronder nog een klein plaatje om het geheel wat op te vullen.

scrollbar links

stylesheet voor de "left-handed scrollbar"


<style type="text/css">
	#scrollbar-left-handed{
		unicode-bidi:bidi-override;
		direction:rtl;
		display:block;
		width:240px;
		height:200px;
		overflow:auto;
		padding:10px;
		border:1px solid #808080}
	#scrollbar-left-handed::-webkit-scrollbar{
		width:18px;background:#ddd}
	#scrollbar-left-handed::-webkit-scrollbar-thumb{
		background:#8080ff}
</style>

de html code voor de left-scrollbar procedure


<div id="scrollbar-left-handed">
	<div dir="ltr">
		<img src="http://static.dns5.nl/scrollbar-boven.jpg" />
		<p><small>Als jouw browser de left-scrollbar procedure ondersteunt zal het 
		resultaat duidelijk zijn. Voor diégenen, waar de browser geen scrollbar 
		aan de linkerkant heeft geplaatst, een korte uitleg. 
		De hieronderstaande stylesheet en de dáár-onder 
		geplaatse html-code zorgen er voor dat (mits er browser-support is) 
		de scrollbar aan de linkerkant getoond zal worden. 
		Om er zeker van te zijn dat de scrollbar zal verschijnen, staat 
		hieronder nog een klein plaatje om het geheel wat op te vullen. 
		</small></p>
		<img src="http://static.dns5.nl/scrollbar-left.jpg" />
	</div>
</div>
Gebruik voor alle voorbeelden op de http://kompoos.nl een valide html5 pagina.