diedVIPs

html knowhow

Mini Info Popup










Mini Info Popup

Mit diesem kleinen Modul können Sie sich per Zeitbalken anzeigen lassen, wie weit sie eine Seite bereits runtergescrollt sind.

So sieht´s aus




Quellcode
<html>
<head>
<style type="text/css">
.header {position: fixed;top: 0;z-index: 1;width: 100%;background-color: #f1f1f1;}
.header h2 {text-align: center;}
.progress-container {width: 100%;height: 8px;background: #ccc;}
.progress-bar {height: 8px;background: #04AA6D;width: 0%;}
.content {padding: 100px 0;margin: 50px auto 0 auto;width: 80%;}
</style>
</head>

<body >
<div class="header">
<h2>Scroll-Fortschritts-Anzeiger</h2>
<div class="progress-container">
<div class="progress-bar" id="myBar"></div>
</div> </div>
<div class="content">
   .... Hier das, was Sie scrollen lassen ...
</div>
</body>

</html>








Kontakt    Datenschutz   Impressum