Fliegende Nachricht

Beitrag von **Hape** » So 7. Jun 2020, 20:57

In den Header einfügen:

<script language="JavaScript"><!--
//script by Clarence Eldefors http://www.cerebuswebmaster.com

var speed = 20;
var step = 5;
var hide = 10000;
var moveto = 500;

// Do not edit below this line
var left = 0;
function movein(){
  if (document.layers) {
        document.layers['message'].pageX = window.pageXOffset + left;
        left+=step;
        if(left<moveto){ setTimeout('movein()',speed); }
        else { setTimeout('closemessage()',hide); }
    }
   
  else{
  document.getElementById('message').style.left=left+'px';
  left+=step;
  if(left<moveto){ setTimeout('movein()',speed); }
  else { setTimeout('closemessage()',hide); }
  }
}
function closemessage(){
        if (document.layers) {document.layers['message'].visibility='hidden';}
        else{document.getElementById('message').style.visibility='hidden';}
}
//--></script>

Hier dazu der CSS-Abschnitt:

Code: Alles auswählen

<style type="text/css" media="screen">
<!--
#message {top:200px;  border:1px solid black;
         width:200px;background-color:yellow;padding:4px;
         position:absolute;}
-->
</style>

Code: Alles auswählen

<!--  Diesen Code musst Du als -eventhandler- in den body-Tag einbauen -->
<body onLoad="movein()" >

<!--  Diesen Code musst Du in den -body- einbauen -->

<div id="message">Hier kommt die Nachricht rein.<br>Zeilenumbruch<br><b>Fettdruck</b> <i>kursiv</i>......<br>Alles mit normalen HTML-Befehlen.<br><a href="http://www.bannertausch.java24.net" rel="nofollow">Auch Links sind möglich</a><br><p><a href="#" onclick="closemessage();">Fenster schließen</a><br><br>Dieses Fenster schließt nach 10 Sekunden automatisch.</DIV>

<!-- Script-Ende -->
<!-- www-java24.net - DIE Javascript - Ressource -->

Demoseite hier: https://hapes-javascript-demo-page.hpag ... ssage.html