nicht angemeldet
CSS-Filter dynamisch verändern?
Hallo!
Ich möchte auf meiner Seite Thumbnails mit dem gray()-Filter einbauen, die beim Überfahren mit der Maus farbig werden. Ich hab jedoch das Problem, daß ich aus SELFHTML zwar weiß, wie man Parameterwerte eines Filters dynamisch verändern kann, aber wie sieht das mit den Filtern ohne Parameter aus?
Da der gray()-Filter sich so nicht manipulieren lässt...
[...]style.Filters[0].Parameter = neuer Wert;
...war meine Idee, den ganzen Filter einfach zu löschen.
Ich müßte also den gray-Filter gegen keinen Filter Austauschen. Ich versuche das die ganze Zeit ungefähr so:
<html><head><title>Test</title>
<script language="JavaScript" type="text/javascript">
<!--
function dynfilter()
{
document.all.dynbild.filters[0].Apply();
document.all.dynbild.filters[0] = "";
document.all.dynbild.filters[0].Play();
};
//-->
</script></head><body>
<img name="dynbild" src="images/bild001.gif" style="filter:gray();" onmouseover="dynfilter()">
</body></html>
Das klappt aber nicht.
HomeSite 4.5 sagt: 'Das Objekt unterstützt diese Eigenschaft / Methode nicht.'
Was muß ich also machen, um einen solchen Effekt zu erstellen?
Wär' für jede Hilfe sehr dankbar.. tschö, Murphy!
-
Ich möchte auf meiner Seite Thumbnails mit dem gray()-Filter einbauen, die beim Überfahren mit der Maus farbig werden. Ich hab jedoch das Problem, daß ich aus SELFHTML zwar weiß, wie man Parameterwerte eines Filters dynamisch verändern kann, aber wie sieht das mit den Filtern ohne Parameter aus?
die Bilder in 2 Versionen (farbig und sw) zu speichern und dann dynamisch auszutauschen wäre wohl schöner. Und funzt auch nicht nur im IE...
<img src="sw.png" onmouseover="this.src='color.png'" ounmouseout=this.src='sw.png" />
.. das ganze geht auch noch irgendwie über document.images, so dass es dann sogar Netscape 3 rallt....
-
Hi Kai
die Bilder in 2 Versionen (farbig und sw) zu speichern und dann dynamisch auszutauschen wäre wohl schöner.
Im Ernst? Ich fand diese Lösung weniger schön (aus Speicherplatz und Ladezeitgründen). Außerdem würde das bedeuten, ich muß um die 75 Thumbnails nochmal überarbeiten muß... keine schöne Aufgabe für ein faules Stück wie mich.
Und funzt auch nicht nur im IE...
Das ist mir bei der Page egal, alle die die besuchen sind Freunde, Bekannte und Verwandte von mir, und wissen das alle andern Browser als der IE 4 arge Probleme mit der Interpretation meiner Seite haben... und sollte doch mal jemand mit nem andern Browser daher gelaufen kommen, wird er/sie von einem netten Script drauf hingewiesen, dass die Seite nur mit IE 4 angezeigt werden kann, und wo in selbiger Windows-Systemen aufzurufen ist.
(bei der Seite geht's um Style, und nicht um Kompatibilität)Aber um noch mal auf die Frage mit den Filtern zurück zu kommen:
Geht es überhaupt Parameterlose Filter zu verändern oder nicht?
Wenn ja, wie?-
Das ist mir bei der Page egal, alle die die besuchen sind Freunde, Bekannte und Verwandte von mir, und wissen das alle andern Browser als der IE 4 arge Probleme mit der Interpretation meiner Seite haben... und sollte doch mal jemand mit nem andern Browser daher gelaufen kommen, wird er/sie von einem netten Script drauf hingewiesen, dass die Seite nur mit IE 4 angezeigt werden kann, und wo in selbiger Windows-Systemen aufzurufen ist.
naja, dann is mir auch dein Problem egal. - schließlich ist die Seite für mich, der kein Kompiliertes Sicherheitsrisiko besitzt (und auch kein Windwos) damit eh nicht existent.
-
naja, dann is mir auch dein Problem egal.
Entschuldige bitte, ich wollte hier keinem auf den Schlipps treten, aber wenn Du willst kannst Du ja mal probieren wie weit man auch ohne IE kommt... ich hab's ehrlich gesagt noch nie ausprobiert.
Wär aber mal ganz spannend zu wissen.
(Die Seite ist aber noch im Aufbau, und noch lang nicht komplett)Also bei Interesse hier klicken:
-
Also bei Interesse hier klicken:
eh, wo..? da is nur ein Zeilenende :)
Wenn das die gleiche Seite wie oben immer erwähnt ist, hast du wohl deinen Server noch nicht überredet das auch als HTML zu senden..-
Moin
eh, wo..? da is nur ein Zeilenende :)
Wenn das die gleiche Seite wie oben immer erwähnt ist, hast du wohl deinen Server noch nicht überredet das auch als HTML zu senden..Och da ist nur sein Redirect kaputt und führt auf http://home.t-online.de/home/GCA-Labor-MS/holger/holgerscreek.html/. Sein Webserver hat keine Ahnung was für einen Mime-typ er senden soll und sendet einfach mal text/plain mit. Dem IE ist das natürlich schnuppe, der kann nämlich kein HTTP und rät deswegen den Content-Type einfach (zur Abwechslung mal richtig). Alle anderen Browser, die machen was man ihnen sagt, zeigen natürlich die vermeintliche Textdatei an. Einfach das / am Ende wegnehmen und dann geht es auch ohne IE.
--
Henryk Plötz
Grüße aus Berlin-
Och da ist nur sein Redirect kaputt und führt auf http://home.t-online.de/home/GCA-Labor-MS/holger/holgerscreek.html/. Sein Webserver hat keine Ahnung was für einen Mime-typ er senden soll und sendet einfach mal text/plain mit. Dem IE ist das natürlich schnuppe, der kann nämlich kein HTTP und rät deswegen den Content-Type einfach (zur Abwechslung mal richtig). Alle anderen Browser, die machen was man ihnen sagt, zeigen natürlich die vermeintliche Textdatei an. Einfach das / am Ende wegnehmen und dann geht es auch ohne IE.
löl...
und ob man's glaubt oder nicht.. das ganze ist soigar in Mozilla genießbar!
-
Ehrlich gesagt versteh ich euch grad nicht ganz... 'Mime Type?' 'Kann HTTP nicht?'
Was heißt das?
Und was ist Mozilla? Ich gerade IE WÄRE Mozilla??Auch wenn euch das noch mehr zum 'löllen' bringt, was ist an meiner Seite so grundsätzlich falsch, dass nur Quellcodes angezeigt werden??
-
Moin
Ehrlich gesagt versteh ich euch grad nicht ganz... 'Mime Type?' 'Kann HTTP nicht?'
Was heißt das?
Und was ist Mozilla? Ich gerade IE WÄRE Mozilla??Ok, ich versuche mal das zu erklären: HTTP läuft in etwa so ab:
Browser an Server: Ich hätt gern die Datei X
Server an Browser: Hier hast du Datei X. Sie ist Y Bytes groß und vom Typ Z.Wenn der Browser den Server nach der Datei fragt hat er noch keinen blassen Schimmer, was für eine Datei er kriegen wird, daher sendet der Server den Dateityp als Mime-Type mit. Für HTML-Seiten ist das üblicherweise text/html.
Nun hat der IE aber ein paar Probleme beim Verarbeiten von HTTP. Anscheinend findet die vom Server gesendete Mimetyp-Angabe nirgendwo Verwendung. Statt dessen schaut sich der IE einfach die ersten paar Bytes der Datei an und 'rät' dann, was für einen Typ die Datei denn wohl haben könnte. Das ist insbesondere nervig, wenn der Server absichtlich einen anderen Mime-Type mitsendet, als der IE rät, weil man etwa den Sourcecode zeigen möchte und daher "text/plain" sendet: Der IE sieht die ersten paar Bytes, denkt sich, dass das eine HTML-Seite sein könnte und fängt munter an den HTML-Code zu interpretieren. (Da gabs auch noch andere Geschichten, etwa dass man ihn dazu bringen konnte den HTML-Code in einem GIF-Kommentar auszuführen, obwohl die Datei eindeutig vom Server als Bild gekennzeichnet war.)
Bei dir passiert nun folgendes: Dein Redirect von http://www.holgerscreek.de führt auf http://home.t-online.de/home/GCA-Labor-MS/holger/holgerscreek.html/ (beachte das / am Ende). Der Server sieht das nun und versucht das Verzeichnis zu öffnen, was fehlschlägt. Er sieht dass es da aber eine Datei gleichen Namens gibt und öffnet statt dessen diese (hmm, das kenne ich eigentlich nur von PHP-Skripts, aber sei's drum) und sendet sie zum Browser. Leider scheint er nicht mehr zu wissen, dass er eine HTML-Datei geöffnet hat (das / am Ende scheint wohl zu verwirren) und sendet einfach mal den Mimetyp text/plain mit. Ein Browser der nun HTTP richtig beherrscht, empfängt diesen Typ und weiss, dass jetzt ein Textdokument kommt und gibt sich keine weiter Mühe nach HTML-Code Ausschau zu halten. Nicht so der IE! Der schaut sich die ersten paar Bytes an, findet ein <html> und hastenichgesehn, fängt er an den HTML-Code zu interpretieren.Lösung: mach das / am Ende des Dateinamens im redirect weg.
Zu IE vs. Mozilla: Ich nehme an, du beziehst dich auf http://selfhtml.teamone.de/diverses/clients.htm. Die meisten Browser identifizieren sich im User-Agent-String als Mozilla oder Mozilla/compatible. Das hat historische Ursachen. Der IE hat aber mit dem Mozilla von http://www.mozilla.org/ nur soviel gemein, als dass beides Web-Browser sind. Was allerdings stimmt, ist dass der Netscape-Browser seit Version 6 auf den Quellen des Mozilla-Projektes basiert.
Ich hoffe, hier für ein bisschen mehr Klarheit gesorgt zu haben.
--
Henryk Plötz
Grüße aus Berlin
-
-
-
-
-
-
-
hi,
die Bilder in 2 Versionen (farbig und sw) zu speichern und dann dynamisch auszutauschen wäre wohl schöner.
Im Ernst? Ich fand diese Lösung weniger schön (aus Speicherplatz und Ladezeitgründen). Außerdem würde das bedeuten, ich muß um die 75 Thumbnails nochmal überarbeiten muß... keine schöne Aufgabe für ein faules Stück wie mich.
irfanview (freeware) wandelt deine bilder im batchbetrieb um - vergrößern, verkleinern, in schwarz/weiß umwandeln, farbtiefe reduzieren usw. es könnte ja durchaus vorkommen, daß ein besucher ohne M$-browser vorbeikommt...
http://irfanview.tuwien.ac.at/deutsch.htm
lg
orlando
-
-
-
Hi Murphy
Ich möchte auf meiner Seite Thumbnails mit dem gray()-Filter einbauen, die beim Überfahren mit der Maus farbig werden. Ich hab jedoch das Problem, daß ich aus SELFHTML zwar weiß, wie man Parameterwerte eines Filters dynamisch verändern kann, aber wie sieht das mit den Filtern ohne Parameter aus?
»»
Der Grundgedanke ist nicht verkehrt, du mußt nur die richtigen Methoden verwenden. In diesem Fall einfach mit setAttribute und removeAttribute arbeiten.
also einfach so:
<script language="JavaScript" type="text/javascript">
<!--
function dynfilter(wie)
{
if (wie==1) document.all.dynbild.style.removeAttribute("filter",false);
else document.all.dynbild.style.setAttribute("filter","gray()",false);
};
//-->
</script></head><body>
<img height="40" width="40" name="dynbild" src="images/bild001.gif" style="filter:gray();" onmouseover="dynfilter(1)" onmouseout="dynfilter(0)">siehe auch:<selfhtml.teamone.de/javascript/objekte/style.htm>
Viele Grüße
Antje
-
Danke Antje!
Ich glaub das hab ich bis hier jetzt auch verstanden :)
Nur da kommt doch glatt das Nächste Problem daher :(Weils einfach prakitscher ist, lasse ich ein JScript den HTML-Code für die Thumbnails schreiben. Nu finde ich nirgends eine Lösung, wie man in Deiner Funktion das 'dynbild' mit einer Variable erweitern kann.
Meine Versuche 'bildnr' einzuklammern endeten immer in etwas wie: document.all.bild.1.style... aber es müsste eigentlich document.all.bild1.style... rauskommen. Hast Du dafür vielleicht auch eine Lösung?_____________
<html>
<body>
<script language="JavaScript" type="text/javascript">
<!--
function gray(wie,bildnr)
{
if (wie==1) document.all.bild•hier muß die 'bildnr' rein•.style.removeAttribute("filter",false);
else document.all.bild•hier muß die 'bildnr' rein•.style.setAttribute("filter","gray()",false);
};
//-->
</script>
</head>
<body>
<table align="center"><tr><td width=450>
<script language="JavaScript">
for(var i = 0; i < 20; i++)
{
document.write("<a onmouseover=gray(1,",[i],") onmouseout=gray(0,",[i],")>");
document.write("<img name=bild",[i]," src=images/fotos/thumb/bild",[i],".gif width=90 height=110 border=0 style=filter:gray()>");
document.write("</a>");
}
</script>
</td></tr></table>
</body>
</html>
______________Tschüß Murphy
-
Hi Murphi
so:
function gray(wie,bildnr)
{
if (wie==1) document.all["bild"+bildnr].style.removeAttribute("filter",false);
else document.all["bild"+bildnr].style.setAttribute("filter","gray()",false);
};<script language="JavaScript">
for(var i = 0; i < 20; i++)
{
document.write('<a onmouseover="gray(1,'+i+'")" onmouseout="gray(0gray(1,'+i+'")">');
document.write('<img name="bild'+i+'" src="images/fotos/thumb/bild'+i+'.gif" width="90" height="110" border="0" style="filter:gray()">');
document.write("</a>");
}
</script>Wie du siehst habe ich die Maskierung verändert, dann erhälst du sauberen Quellcode.
Viele Grüße
Antje
-
script language="JavaScript">
for(var i = 0; i < 20; i++)
{
document.write('<a onmouseover="gray(1,'+i+')" onmouseout="gray(0gray(1,'+i+')">');
document.write('<img name="bild'+i+'" src="images/fotos/thumb/bild'+i+'.gif" width="90" height="110" border="0" style="filter:gray()">');
document.write("</a>");
}
</script><grr>
da hatten sich 2 "" zuviel eingeschlichenGruß
Antje
-
Danke Antje, Du bist die Beste!
<grr>
da hatten sich 2 "" zuviel eingeschlichenNicht schlimm, denn wenn einer Fehler macht, dann bin ich das :)
(oder deute ich das <grr> falsch?)LG, Murphy!
-
-
-
-