|
tululum
Profil * |
#1 · Zasláno: 15. 11. 2009, 17:00:02
Dobrý den,
Chtěl bych se zeptat, jak udělat lištu, která je třeba neustále u spodního okraje a pohybuje se při scrollování, jako by byla přilepená k okraji prohlížeče (prostě když scrolluju, scrolluje to s obsahem webu, ale ta lišta je pořád na stejném místě - přilepená k okraji).
Mají takovou třeba na facebooku, nebo na www.joomlart.com
Prosím máte někde nějaký článek, nebo kód, k podobné liště? Rád bych se naučil takév dynamické prvky vytvářet.
(hodil by se mi i článek o této problematice - například jestli jsou nějaké její nevýhody, jak je na tom s kompatibilitou apod.)
Díky za každý článek ;)
|
|
|
tululum
Profil * |
#2 · Zasláno: 15. 11. 2009, 17:22:04
Tak nic, už jsem to náhodou našel
(pro zájemce: je to dokonce tady na webu (ale jen hodně lemo zmíněné (http://www.jakpsatweb.cz/css/css-pozicovani.html)) jinak tady je celkem pěkný příklad:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#footer {
color: #ffffff;
font-size: 14px;
font-family: Verdana, Geneva, Arial, sans-serif;
background-color: blue;
text-align: center;
position: fixed;
bottom: 0px;
left: 0px;
width: 100%;
height: 28px
}
BODY {
font-size: 14px;
text-align: left;
}
-->
</style>
</head>
<body >
<div id="footer">
<table>
<td>
<select name="select1">
<option value="">Font Family</option>
<option value="Arial">Arial</option>
<option value="Helvetica">Helvetica</option>
<option value="Tahoma">Tahoma</option>
<option value="Times New Roman">Times New Roman</option>
<option value="Verdana">Verdana</option>
</select>
</td>
<td>
<select name="select2">
<option value="">Font Color</option>
<option value="Black">Black</option>
<option value="Blue">Blue</option>
<option value="Green">Green</option>
<option value="Orange">Orange</option>
<option value="red">Red</option>
<option value="Violet">Violet</option>
<option value="Yellow">Yellow</option>
</select>
</td>
<td>
<select name="select3">
<option value="">Background Color</option>
<option value="Blue">Blue</option>
<option value="Green">Green</option>
<option value="Orange">Orange</option>
<option value="Red">Red</option>
<option value="Violet">Violet</option>
<option value="Yellow">Yellow</option>
</select>
</td>
<td>
<select name="select4">
<option value="">Font Size</option>
<option value="x-small">X-Small</option>
<option value="small">Small</option>
<option value="medium">Medium</option>
<option value="large">Large</option>
<option value="x-large">X-Large</option>
<option value="xx-Large">XX-Large</option>
</select>
</td>
<td>
<button>Reset</button>
</td>
</table>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque non bibendum erat. Etiam eu magna at libero accumsan porta. Proin pellentesque magna eget turpis gravida adipiscing. In bibendum consequat facilisis. Ut egestas sem id est auctor vel vestibulum risus rutrum. Pellentesque ac est non justo ullamcorper tempor ut in magna. Aliquam facilisis turpis sed augue posuere porttitor. Nulla tortor lectus, aliquet a ornare a, tempor vel purus. Sed orci orci, condimentum eu pharetra ullamcorper, luctus id dolor. Nulla id augue eget dolor fringilla molestie vitae eleifend diam. Aliquam ac ante nisi, non venenatis augue. Pellentesque id elit sed enim accumsan elementum ac in ipsum. In et lectus eu arcu viverra faucibus et id ante.<br/><br/>
Nulla luctus mattis nisl eget pretium. Integer gravida arcu id ipsum cursus semper. Mauris pellentesque molestie molestie. Aliquam in dolor odio, sit amet rhoncus tortor. Suspendisse lobortis ultricies odio a mollis. Phasellus pellentesque placerat velit, at accumsan mauris dignissim eget. Aenean euismod lorem interdum magna volutpat nec sagittis odio convallis. Ut malesuada elit lobortis nisi pharetra molestie. Vivamus convallis aliquam est, tristique luctus odio interdum vitae. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Duis eget quam vitae felis bibendum blandit eget ut sapien. Donec rutrum sem in est euismod ut mattis nisl imperdiet. Donec consequat sollicitudin eros. In et erat in elit auctor consequat. Nulla sapien odio, commodo in tincidunt id, ultricies in sem. Fusce dignissim urna aliquet mi laoreet vehicula. Sed non massa ligula. Aenean lacus quam, elementum ornare consectetur sed, ultrices ullamcorper ante.<br/><br/>
Phasellus tincidunt feugiat nunc, vitae mattis mi tincidunt at. Nullam felis tortor, adipiscing sed fermentum eget, scelerisque ut velit. Aenean libero justo, tempor at congue a, eleifend sit amet urna. Donec id orci eget nulla vestibulum hendrerit sit amet venenatis ipsum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas porttitor porta felis, sed lobortis arcu tincidunt a. Vestibulum eleifend luctus tellus non pretium. Vestibulum tempus interdum lorem, non vehicula orci facilisis ut. Nulla non felis non augue porta accumsan. Phasellus dolor ante, hendrerit ac posuere vel, dignissim ac lectus. Nullam dignissim iaculis sapien id condimentum.<br/><br/>
Mauris porttitor elit in ligula ornare vestibulum. Donec fermentum ante ut nulla pharetra non ullamcorper quam ullamcorper. Donec a viverra odio. Cras at risus nunc. Sed pellentesque gravida est, non ultrices neque porta sed. Nunc porta pellentesque porttitor. Mauris malesuada, quam ac sodales vestibulum, urna magna consequat eros, id gravida lectus lorem et mauris. Maecenas nisl metus, tempor vitae aliquam non, interdum nec quam. Nunc gravida fringilla diam non porta. Maecenas erat metus, mattis eu vulputate non, posuere faucibus tellus. Pellentesque fringilla eros vehicula risus dapibus quis pellentesque ante porta. Quisque egestas malesuada pulvinar. Nulla condimentum dignissim neque at fermentum. Sed cursus, enim in varius convallis, mauris massa posuere tortor, pharetra scelerisque justo libero ornare urna. Proin sit amet nunc at mauris ultrices tempor sed sed magna. Proin vel magna nisl. Integer commodo mollis nulla, sed mollis mauris blandit eu. Mauris iaculis rhoncus massa, eget porttitor tellus euismod at. Nam ornare magna eu tortor mattis lobortis.<br/><br/>
Donec venenatis varius magna, vel eleifend lectus fermentum ut. Aenean elit odio, tincidunt quis sodales vel, tempus ut justo. Nulla vitae tortor in mauris vehicula laoreet a in dolor. Phasellus ornare justo dictum ligula sollicitudin vel accumsan arcu eleifend. Nullam a mauris nibh, ac semper massa. Proin commodo sollicitudin felis, eu malesuada urna condimentum sit amet. Vestibulum malesuada, felis in convallis tempus, metus purus volutpat dui, ut rhoncus sem ante ut lectus. Fusce vitae lacus vitae erat dignissim facilisis vitae sed orci. Mauris luctus, odio nec scelerisque adipiscing, magna leo semper libero, vel venenatis ante ligula a tellus. Nam id nibh elit, vitae volutpat dui. Ut eu mollis odio. Ut sed neque arcu, a scelerisque lectus.<br/><br/>
Suspendisse mollis sapien ac urna tincidunt faucibus. Quisque accumsan, metus sed pharetra porta, erat massa congue tortor, id rutrum urna erat nec ante. Morbi vestibulum neque at nisl pellentesque volutpat. Vestibulum non lacus sapien, eu adipiscing sem. Nam erat eros, euismod at placerat at, posuere sit amet nunc. Duis blandit erat id augue molestie pellentesque. Praesent vel enim ac dui porttitor vestibulum. Donec tincidunt, sem vitae cursus vulputate, diam risus consectetur elit, et tempor enim mauris sit amet ipsum. Aenean nibh elit, viverra ac lobortis vel, bibendum at elit. Donec rhoncus, magna ac sagittis fermentum, tellus augue blandit massa, eget aliquet tellus mi vitae mi. Proin venenatis magna et arcu laoreet consequat a sed ipsum. Sed eu tempus tellus. Fusce vel mi nisi, in imperdiet est. Mauris vestibulum molestie diam, sed auctor quam cursus vitae. In hac habitasse platea dictumst. Vestibulum ut eros leo, quis ultrices mi. Praesent luctus mi sit amet enim dapibus ullamcorper fermentum enim rhoncus.<br/><br/>
Ut convallis, nisi nec eleifend commodo, libero magna pretium nibh, et laoreet magna magna sit amet dui. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris erat tortor, ornare vel lobortis et, dictum at diam. Quisque feugiat dui id neque consectetur egestas. Ut elit nunc, convallis et faucibus non, feugiat vitae lectus. Ut rutrum pellentesque est vitae placerat. Nunc sapien augue, congue a sollicitudin nec, lobortis vitae lorem. In hac habitasse platea dictumst. Vestibulum mattis posuere sodales. Quisque et metus tellus. Donec suscipit felis at velit sollicitudin hendrerit. Maecenas velit lacus, vestibulum sit amet accumsan sed, vulputate vel nisi. Aenean vestibulum nibh non mauris imperdiet tincidunt. Vivamus vel purus ut leo mollis fringilla. Vivamus nisl tellus, euismod ac adipiscing et, hendrerit ut ipsum.<br/><br/>
Fusce molestie sapien vel eros dictum eu pharetra orci vehicula. Vestibulum a dui nunc. Maecenas dolor quam, lacinia vel aliquet sed, commodo tincidunt justo. Vestibulum at ligula vel est convallis ullamcorper. Vivamus lobortis odio a ligula ornare lobortis. Vestibulum accumsan faucibus tristique. Ut rhoncus diam ac lacus sagittis molestie. Ut hendrerit tempus commodo. Cras elit lorem, iaculis sed pellentesque at, volutpat at velit. Duis sollicitudin est ut ipsum lacinia pulvinar. Quisque nec lorem vitae dolor dignissim luctus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pretium neque nec elit accumsan in posuere enim imperdiet. Aliquam lobortis arcu eu dolor mattis sagittis. Pellentesque id ali
|
|
