Laufband

MaBe

Hallo zusammen,

ich hab mal eine Frage. Ich bin gerade dabei an einer Präsentationsseite für ein Meteorologentreffen zu arbeiten. Dabei gibt es natürlich auch Sponsoren, die auf der Seite vertreten sein wollen. Nun dacht ich mir, es wäre doch ne tolle Sache, wenn ich ein Laufband hätte, wo diese Sponsorenlogos von oben nach unten durchlaufen (wobei am Ende es eben wieder von vorne los geht). Also ähnlich nem News-Ticker, den man immer bei den Nachrichten unten durchlaufen lässt, nur eben von oben nach unten und mit den Logos.
Nun hab weder Flash, noch Ahnung davon. Daher wollte ich wissen, ob jmd von euch evtl irgendwo einen fertigen Code für soetwas hat, den ich dann einfach nur einbaue.

Ist das evtl möglich? Das wäre echt ne super Sache, falls nicht, dann muss ich sie halt einfach untereinander anordnen, aber als Laufband fänd ich das schon genial.

Grüße und herzlichen Dank
Marcus

sejuma

Code

<marquee direction="down">
[img]logo1.gif[/img]


[img]logo2.gif[/img]
</marquee>

MaBe

Hallo,

danke ersteinmal für deine Antwort. Das ist alles ? Kann ich mir ja fast nicht vorstellen. Also wenn ich diesen code so einbaue, habe ich eine Leiste, wo die Bilder von oben nach unten durchlaufen?

Gruß und viele Dank
MaBe

sejuma

That's all!
Du kannst natürlich diesen Code noch in einen DIV oder eine Tabelle einbauen, wo du z.B. die Höhe und Breite des Laufband-Bereiches definierst.

Okee, werde ich mal versuchen. vielen dank ersteinmal

Gruß
MaBe

Gulasch007

Mhm Wie Sieht der code dann mit DIV aus bekomme es nicht hin !

anspiUCNapufn9

Code

<div style="height: 200px; width: 100px;">


//Marqueecode von oben


</div>

Einfach den wert 200px durch die Höhe und 100px durch die Breite ersetzen

synaptic

geht auch noch etwas komplizierter....

HTML

<html>
<head>
  <title>NewsLayer</title>
  <script type="text/javascript">
  var clipOben = 0;
  var clipRechts = 200;
  var clipUnten = 200;
  var clipLinks = 0;


  function startScrollen(){
  setTimeout("scrollen()", 500);
  }

  function scrollen(){
  var scrollFenster = document.getElementById("NewsLayer");
  //überprüfen, ob man am unteren Rand ist
  if (clipUnten != 900){
  //wenn nicht, dann passe die variablen an, die den Fensterausschnitt verfolgen
  clipOben = clipOben + 10;
  clipUnten = clipUnten + 10;
  //fensterausschnitt nach unten und den Layer nach oben verschieben
  scrollFenster.style.clip = "rect(" + clipOben + " " + clipRechts + " " + clipUnten + " " + clipLinks + ")";

  var aktuellOben = parseInt(scrollFenster.style.top);
  scrollFenster.style.top = (aktuellOben - 10) + "px";

  //den nächsten Aufruf der funktion scrollen() festlegen
  setTimeout("scrollen()", 500);
                        }

  else{
  // wenn man ganz unten ist, werden die variablen zurückgesetzt
      clipOben=0;
	  clipUnten=200;
  //der fensterausschnitt und die layerpositin wird zur ursprünglichen position gesetzt
  scrollFenster.style.clip = "rect(" + clipOben + " " + clipRechts + " " + clipUnten + " " + clipLinks + ")";
  scrollFenster.style.top = "40px";
  // scrollen beginnt wieder von vorne
  setTimeout("scrollen()", 500);
	  }
                      }
  </script>

</head>
<body onLoad="startScrollen();">
<div id="NewsLayer" style="position:absolute; left:100px; top:40px; width:200px; height:900px;z-index:1; clip:rect(0 200 200 0); background:#C5F5FF;">


anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  


 
anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  
 
anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  

anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  

anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  

anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  
 
anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  anderer text anderer text  
 
ende des anderen textes^^


</div>


<div style="position:absolute; top:50px; margin-top:200px; margin-bottom:200px; background:#FF0023;">
...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... 
...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... 
...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... 
...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... ...bla ...bla... 


</div>


<div id="TitelLayer" style="position:absolute; left:100px; top:15px; width:200px;height:25px; z-index:2; background:#CCCCCC;">
<h2>NewsTitel</h2>


</div>
</body>
</html>

Alles anzeigen

ich empfehle aber diese seite dann über einen iframe anzuzeigen, der nicht scrollbar ist... sieht einfach besser aus! (sonst hat der scrollbalken der seite ein merkwürdiges eigenleben )

Laufband

Tags

Benutzer online in diesem Thema