javascript und variable hintergrundgrafik
anke
- javascript
0 Christoph Schnauß0 Ingeborg Brase0 Bio0 Thomas Meinike0 anke
hallo welt!
ist es eigentlich möglich, durch ein javascript die hintergrundgrafik einer
homepage zu variieren (z.B. abhängig von der auflösung des bildschirms)?
die auflösung des bildschirms habe ich bereits ermittelt und davon abhängig
einen dateinamen generiert. nur wie kann ich diese javascript-"function" im <body>-task
einbinden?
oder hat jemand eine andere geniale idee (nicht notwendiger weise in javascript),
mit der ich die hintergrundgrafik variabel gestalten kann ohne verschiedene
versionen der homepage erstellen zu müssen?
danke, anke
hallo Anke,
prinzipiell ist das moeglich - mit Javascript oder eventuell mit Java. Aber es ist nicht klar, was du unter "variabel" verstest. Soll die Grafik ausgetauscht werden und dann stehenbleiben oder willst du einen "Hintergrundfilm" ablaufen lassen ?
Ein einfaches Beispiel, wie man Hintergrundfarben wechseln kann:
<script language="JavaScript">
<!--
aktiv = window.setInterval("Farbe()",2000);
i = 0, farbe = 1;
function Farbe()
{
if(farbe==1)
{ document.bgColor="black"; farbe=2; }
else
{ document.bgColor="800000"; farbe=1; }
i = i + 1;
if(i >= 20)
window.clearInterval(aktiv);
}
//-->
</script>
aehnlich, mit ein paar Zeilen Code mehr und der Quellenangabe fuer eine Bilddatei, funktioniert das auch mit Bildern (GIF oder JPG).
Christoph S.
aehnlich, mit ein paar Zeilen Code mehr und der Quellenangabe fuer eine Bilddatei, funktioniert das auch mit Bildern (GIF oder JPG).
Du kannst mit bgColor das Hintergrundbild ändern?
AFAIK gibts nichts für das Bild. Bestenfalls noch mit document.all aber dann nicht in Netscape und das dynamische Neuschreiben von Stylesheets führt zum Absturz.
Du kannst mit bgColor das Hintergrundbild ändern?
Unsinn ... ich habe ausdruecklich gesagt, "aehnlich". Mit "bgcolor" kann ein Hintergrundbild nicht angesprochen werden, das braucht man hier wahrhaftig nicht diskutieren. Lies bitte erst richtig.
Ich habe ein funktionierendes Beispiel fuer Hintergrundwechsel zuhause, also im Moment nicht zur Hand.
AFAIK gibts nichts für das Bild. Bestenfalls noch mit document.all aber dann nicht in Netscape und das dynamische Neuschreiben von Stylesheets führt zum Absturz.
da bin ich nicht so sicher, ob das grundsaetzlich zu Abstuerzen fuehren muss. Fuer den IE gibts noch die Moeglichkeit, die Filter zu probieren, wie in SELFHTML angesprochen.
Christoph S.
Unsinn ... ich habe ausdruecklich gesagt, "aehnlich". Mit "bgcolor" kann ein Hintergrundbild nicht angesprochen werden, das braucht man hier wahrhaftig nicht diskutieren. Lies bitte erst richtig.
Sorry! Da hatte ich den Smiley vergessen ;-)
da bin ich nicht so sicher, ob das grundsaetzlich zu Abstuerzen fuehren muss. Fuer den IE gibts noch die Moeglichkeit, die Filter zu probieren, wie in SELFHTML angesprochen.
Mein NC stürzt relativ zuverlässig dabei ab. Unter Linux auch bei Links, die man neu schreibt. Und der 3er bei was-weiß-ich-nicht-noch.
Sorry! Da hatte ich den Smiley vergessen ;-)
ok, jetzt steht er ja da *g*
...
Mein NC stürzt relativ zuverlässig dabei ab. Unter Linux auch bei Links, die man neu schreibt. Und der 3er bei was-weiß-ich-nicht-noch.
hm, ich muesste es nochmal durchspielen. Was fuer eine LINUX-Distribution hast du ? Und hast du selber einen Kernel gebaut ?
Ich habe im Moment eine S.u.S.E. LINUX 6.3 mit allerhand Krimskrams ringsherum ... ich kuck mir das nochmal gruendlicher an. Dass LINUX "abstuerzt", ist aeusserst selten, kommt aber auch vor; zum Glueck kann man dann auf die naechste Konsole wechseln.
Christoph S.
hm, ich muesste es nochmal durchspielen. Was fuer eine LINUX-Distribution hast du ? Und hast du selber einen Kernel gebaut ?
Ich habe im Moment eine S.u.S.E. LINUX 6.3 mit allerhand Krimskrams ringsherum
... ich kuck mir das nochmal gruendlicher an. Dass LINUX "abstuerzt", ist aeusserst selten, kommt aber auch vor;
»» zum Glueck kann man dann auf die naechste Konsole wechseln.
Ja, das tut gut :-))
Ich habe Kernel 2.2.10 auf SuSE 6.2 (glaube ich). Den Kernel habe ich tatsächlich selbstkompiliert.
Das tut aber nichts zur Sache, dem Kernel geht's nämlich gut. Nur Netscape (4.61) verschwindet von Zeit zu Zeit mal vom Bildschirm.
Am Zuverlässigten geht es mit meinem Ticker-Script. Ich habe eins geschrieben, das sich ähnlich wie <marquee> verhält (nur für NC) wobei ich den Text in einem layer (div) per document.open /write/close neu schreibe.
Wenn sich bei diesem Text ein Link befindet und die Maus über dem Link ist, macht sich Netscape totsicher aus dem Staub.
Netscape (4.61) verschwindet von Zeit zu Zeit mal vom Bildschirm.
Am Zuverlässigten geht es mit meinem Ticker-Script. Ich habe eins geschrieben, das sich ähnlich wie <marquee> verhält (nur für NC) wobei ich den Text in einem layer (div) per document.open /write/close neu schreibe.
Wenn sich bei diesem Text ein Link befindet und die Maus über dem Link ist, macht sich Netscape totsicher aus dem Staub.
hehe, du solltest entweder den Code posten oder eine URL angeben - vielleicht hast du auch was im Code falsch
Christoph S.
... schwierige Sachen dauern etwas länger.
Ich habe mal mein projektspezifisches Zeugs entfernt und das so zusammengeschnippelt, daß es geht.
---Beginn----tot.html---
<html>
<head>
<title>Absturztest für Netscape</title>
<meta name="author" content="Henryk Plötz HenrykPloetz@gmx.de">
<meta name="generator" content="Ulli Meybohms HTML EDITOR">
</head>
<script language="JavaScript">
<!--
var ns=false;
var ie=false;
// die aktuelle Position des Tickers
var tickerpos=0;
var tickerTimerID=null;
// Zeigt das, was im Ticker stehen soll
// Hinweis: Leerzeichen als schreiben
var tickertext='<a ;href="http://www.teamone.de/selfhtml">SelfHTML</a> ist toll. Dieser Text dient nur der Füllung. ';
function maketicker()
{
tickerpos=(tickerpos+1)%(tickertext.length+1);
while (tickertext.charAt(tickerpos-1)=="&" tickertext.charAt(tickerpos-1)=="<")
{
if(tickertext.charAt(tickerpos-1)=="<")
for (; tickerpos<tickertext.length ; tickerpos++ )
if(tickertext.charAt(tickerpos)==">") {tickerpos=(tickerpos+1)%(tickertext.length+1);break;}
if(tickertext.charAt(tickerpos-1)=="&")
for (; tickerpos<tickertext.length ; tickerpos++ )
if(tickertext.charAt(tickerpos)==";") {tickerpos=(tickerpos+1)%(tickertext.length+1);break;}
}
neutext=tickertext.substring(tickerpos,tickertext.length)+tickertext+tickertext.substring(0,tickerpos);
if(ie) { ticker.innerHTML=neutext;}
if(ns) { document.ticker.document.open();
document.ticker.document.writeln(neutext);
document.ticker.document.close();
}
setTimeout("maketicker()",150);
}
function startme()
{
if(navigator.appName.indexOf("Netscape")!=-1) ns=true;
if(navigator.appName.indexOf("Microsoft")!=-1) ie=true;
window.setTimeout("maketicker()",500);
}
//-->
</script>
<noscript></noscript>
<body onLoad="startme();" ext="#000000" bgcolor="#FFFFFF" link="#0000FF" alink="#000000" vlink="#000099">
<font face="MONOSPACE" size="-2"><layer name="ticker"><div id="ticker"><marquee><a href="http://www.teamone.de/selfhtml">SelfHTML</a> ist toll.</marquee></div></layer></font>
</body>
</html>
---Ende---
Eine URL habe ich leider nicht (http://localhost/web/cjd :-)
Wenn du das in einer Datei hast, vergewissere dich nochmal, daß kein wertvolles Projekt mehr im Composer ist *g* lade die Datei in Netscape Navigator auf Linux, zeige mit der Maus auf den Link und gehe in Deckung.
Momentan habe ich eine Browsererkennung in Betrieb, die bei Linux-Netscape den Ticker abschaltet. Demnächst halte ich den Ticker vielleicht nur onMouseover an.
Hier stimmt was nicht.
In der Variable sind im Urtext alle Leerzeichen durch non-breaking-spaces & nbsp ; ersetzt.
Das Forum baut sie jedoch wieder aus.
var tickertext='<a ;href="http://www.teamone.de/selfhtml">SelfHTML</a> ist toll. Dieser Text dient nur der Füllung. ';
Ohne die ruckelt der text mehr. Ich schreib mir mal eine Funktion, die Leerzeichen durch so etwas ersetzt.
Hi Henryk,
In der Variable sind im Urtext alle Leerzeichen durch non-breaking-spaces & nbsp ; ersetzt.
Das Forum baut sie jedoch wieder aus.
codier sie als . Weia, war das gerade ein ge-ampe ;-)
Gruß,
Martin
Hier stimmt was nicht.
In der Variable sind im Urtext alle Leerzeichen durch non-breaking-spaces & nbsp ; ersetzt.
Das Forum baut sie jedoch wieder aus.
ja, daran ist urspruenglich Matt Wright "schuld", von dem das perlscript stammt, das Stefan Muenz hier fuer das Forum verwendet.
Ich kuck mir deinen Code ueber Ostern mal an, bin allerdings ein paar Tage nicht online, und in der naechsten Woche ist dieser thread garantiert im Archiv verschwunden. Macht ja nix; muss man halt einen neuen aufmachen.
Christoph S.
Hallo Anke,
wenn du die Grafik nur in Abhängigkeit von der Bildschirmauflösung variieren willst, schreib doch am Anfang der Seite in Abhängigkeit von der Auflösung die CSS-Angaben. Hier ein (NICHT GETESTETES) Beispiel :
<SCRIPT LANGUAGE="javascript">
if(navigator.appVersion.substring(0,1) == "4") {
if(screen.width >= 1024) {
Datei = "datei1.jpg";
} else {
Datei = "datei2.jpg";
}
document.write("<style type="text/css">");
document.write("body { background-image:url(" + Datei + "); }");
document.write("</style");
}
</script>
Eine andere Möglichkeit ist auch, zwei externe CSS-Dateien zu laden, je nach Auflösung und die BODY-Angabe dort zu hinterlegen. In dieser Datei können dann auch andere unterschiedliche Formatierungen hinterlegt werden.
Dies wurde schon mal im Forum besprochen (Die Suche nach ld1024 im Archiv müsste erfolgreich sein.)
Ich hoffe, dies hilft dir weiter.
Viel Spaß
Inge
Hi!
Ich habe sowas in einer meiner Seiten, das ganz gut funktioniert (und noch keinmal abgestürzt ist, weder unter Win oder Linux, noch unter Solaris).
Statt ein body-tag zu oeffnen, schreibt man in einen Script-Bereich, der sofort beim Laden ausgeführt wird (also unbedingt und nur EINMAL):
document.write('<body background="bg'+zufall+'.jpg">');
Zufall ist bei mir eine Zufallszahl, alle Bilder heissen eben bg'zahl'.jpg.
Das reicht schon.
Zack ist ein body Tag da und der Browser freut sich. Die Seite wird erst nach dem Ausführen des Skriptes gerendert, darum geht das überhaupt.
Ist die Seite erstmal gerendert, dann geht gar nichts mehr beim Netscape, von wegen im Quelltext rumpfuschen.
Der berüchtigte Netscape-Zeilenumbruch-Bug kann einem allerdings noch alles kaputtmachen :-)
Aber gegen den kann man eh nichts machen.
Bio
oder hat jemand eine andere geniale idee (nicht notwendiger weise in javascript),
mit der ich die hintergrundgrafik variabel gestalten kann ohne verschiedene
versionen der homepage erstellen zu müssen?
Unter <A HREF="http://www.StyleAssistant.de" TARGET="_blank">http://www.StyleAssistant.de</A> findest Du ein Beispiel zum Laden eines zufaelligen Hintergrundbildes (Tips & Tricks Tip 14).
Mit der - bisher nur im IE verfuegbaren Methode createStyleSheet() - kann man CSS-Definitionen "on the fly" erzeugen:
newStyle=document.createStyleSheet();
newStyle.addRule("BODY","Background-Image: url(xyz.jpg)");
(Siehe auch Tip 20 unter der oben genannten Adresse).
HTH & Gruss, Thomas
danke an alle die geholfen haben!
war über ostern nicht zu hause, werde jetzt aber mal rumprobieren.
anke