Vertikaler Newsticker |
Mit diesem Modul können Sie sich auf einen Formmailer setzen lassen. Es ist hier nur die Schablone, also keine Verlinkung zum Mailprogramm. |
So sieht´s aus |
Htmlknowhow möchte Ihnen keine Lehrstunde in html, css oder Java geben,
sondern ganz praktische Tipps, wie Sie ihre Homepage optisch und inhaltlich verbessern können.
Html, CSS und Java bieten da super Möglichkeiten der Webseiten-Gestaltung.
Alle hier dargestellten Modelle habe ich persönlich getestet und sie funktionieren hervorragend.
|
Quellcode |
<html> <head> <style type="text/css"> .vwrap, .vitem {height: 30px; line-height: 30px;} .vwrap {overflow: hidden; background: transparent; text-align:left; width:80%} .vitem {text-align: center;} .vmove {position: relative;} @keyframes tickerv { 0% { bottom: 0; } /* FIRST ITEM */ 30% { bottom: 30px; } /* SECOND ITEM */ 60% { bottom: 60px; } /* THIRD ITEM */ 90% { bottom: 90px; } /* FORTH ITEM */ 100% { bottom: 0; } /* BACK TO FIRST */ } .vmove {animation-name: tickerv; animation-duration: 10s; animation-iteration-count: infinite; animation-timing-function: cubic-bezier(1, 0, .5, 0);} .vmove:hover {animation-play-state: paused;} </style> </head> <body> <div class="vwrap"><div class="vmove"> <div class="vitem">Htmlknowhow möchte Ihnen keine Lehrstunde in html, css oder Java geben, </div> <div class="vitem">sondern ganz praktische Tipps, wie Sie ihre Homepage optisch und inhaltlich verbessern können.</div> <div class="vitem">Html, CSS und Java bieten da super Möglichkeiten der Webseiten-Gestaltung. </div> <div class="vitem">Alle hier dargestellten Modelle habe ich persönlich getestet und sie funktionieren hervorragend.</div> </div></div> </body> </html> |
Kontakt Datenschutz Impressum |
Das war nix |