mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 28.03.2024 09:38 Benutzername: Passwort: Auto-Login

Thema: fade effekt mit js geht nicht wenn angaben in css? vom 13.11.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> fade effekt mit js geht nicht wenn angaben in css?
Seite: 1, 2, 3, 4, 5, 6  Weiter
Autor Nachricht
denise2302
Threadersteller

Dabei seit: 12.09.2006
Ort: Leipzig
Alter: 34
Geschlecht: Weiblich
Verfasst Do 13.11.2008 11:07
Titel

fade effekt mit js geht nicht wenn angaben in css?

Antworten mit Zitat Zum Seitenanfang

Jaaaaa. also ich möchte bei meinen Bildern einen Fade effekt, der link dazu sieht so aus:

Code:

<img src="images/den_cd02th.jpg" style="filter:alpha(opacity=30);-moz-opacity:0.3" onmouseover="init_fader(this,5,20,20,99,1)">


den style würde ich gern mit in mein css nehmen... allerdings wird es dann nicht mehr dunkler, sondern bleibt tranparent, wenn ich beim img:hover die transparenz wieder rausnehme (mit: alpha... none und -moz-op... 10)
dann wird es zwar dunkler aber der fade effekt geht nicht mehr... woran liegt das? Warum geht es so, aber nicht wenn ich es in meine CSS-Datei schreibe?

LG Denise
  View user's profile Private Nachricht senden
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Do 13.11.2008 11:09
Titel

Antworten mit Zitat Zum Seitenanfang

verstehe ich dich richtig? du möchtest den JavaScript Teil in deinem CSS unterbringen?
  View user's profile Private Nachricht senden
Anzeige
Anzeige
denise2302
Threadersteller

Dabei seit: 12.09.2006
Ort: Leipzig
Alter: 34
Geschlecht: Weiblich
Verfasst Do 13.11.2008 11:11
Titel

Antworten mit Zitat Zum Seitenanfang

nein ich möchte den style="filter:alpha(opacity=30);-moz-opacity:0.3" in mein css schreiben, dann funktioniert das ganze aber irgendwie nicht mehr..

Zuletzt bearbeitet von denise2302 am Do 13.11.2008 11:12, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Do 13.11.2008 11:14
Titel

Antworten mit Zitat Zum Seitenanfang

schau mal hier...

http://www.kostenlose-javascripts.de/javascripts/bilder/fade-effekt.html


// es ist schwierig nachzuvollziehen warum es bei dir nicht klappt.da der relevante teil des sourcecodes fehlt.


Zuletzt bearbeitet von Kash am Do 13.11.2008 11:17, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
denise2302
Threadersteller

Dabei seit: 12.09.2006
Ort: Leipzig
Alter: 34
Geschlecht: Weiblich
Verfasst Do 13.11.2008 11:18
Titel

Antworten mit Zitat Zum Seitenanfang

naja der fade effekt geht ja, damit gibt es ja keine probleme, zumindest geht er, wenn die style angaben mit im img tag stehen, will ich sie ins css mit schreiben, dann geht es nicht mehr... ich finde das sehr merkwürdig... ist das nicht egal, ob der mit im tag steht oder im css? ich versteh das nicht so richtig,warum es dann nicht mehr geht.... Menno!
  View user's profile Private Nachricht senden
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Do 13.11.2008 11:20
Titel

Antworten mit Zitat Zum Seitenanfang

wie gesagt das kann ich dir nicht sagen da ich nur den funktionsaufruf sehe. grundsätzlich rate ich von inline-css ab. aber wenn du jetzt deswegen arbeitszeit vertust, lass es wie es ist.
  View user's profile Private Nachricht senden
denise2302
Threadersteller

Dabei seit: 12.09.2006
Ort: Leipzig
Alter: 34
Geschlecht: Weiblich
Verfasst Do 13.11.2008 11:23
Titel

Antworten mit Zitat Zum Seitenanfang

Naja, die Funktion ist so:

Code:

<script type="text/javascript">
<!--
IE  = document.all &&!window.opera;
GK  = window.sidebar;
AOB = [];
x   = 0;

function Fader()
{
  this.timeOut=false;
  this.fade=function(y)
    {
      clearTimeout(this.timeOut);
      this.value=Number(eval('this.object.'+this.attr))+(this.delta*this.evt[y]);
      if(this.value>=this.min && this.value<=this.max)
        {
          eval('this.object.'+this.attr+'='+this.value)
          this.timeOut=setTimeout('AOB['+this.index+'].fade('+y+')',this.rate);
        }
    }
}


function init_fader(obj,delta,rate,min,max,dir)
{
  if(IE || GK)
    {
      AOB.push(new Fader(x));
      OB        = AOB[x];
      OB.index  = x;
      OB.object = obj;
      if(IE)
        {
          OB.attr = 'filters.alpha.opacity';
          OB.faktor = 1;
        }
      else
        {
          OB.attr   = 'style.MozOpacity';
          OB.faktor = 100;
        }
      OB.delta = delta/OB.faktor;
      OB.rate  = rate;
      OB.min   = min/OB.faktor;
      OB.max   = max/OB.faktor;
      OB.evt=[-1,1];if(dir)OB.evt.reverse();
      OB.object.onmouseover = new Function('f1','AOB['+x+'].fade(0)');
      OB.object.onmouseout  = new Function('f2','AOB['+x+'].fade(1)');
      OB.fade(0);x++;
    }
}

//-->
</script>


Naja, es sind relativ viele Bilder die gefaded werden sollen, da ist es praktischer, wenn der Teil mit im CSS steht, weil wenn doch was geändert werden soll ist es dann ziemlich aufwendig, das bei ALLEN Bildern nochmal zu ändern...
  View user's profile Private Nachricht senden
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Do 13.11.2008 11:30
Titel

Antworten mit Zitat Zum Seitenanfang

das liegt an den folgenden zeilen

Code:

 OB.attr = 'filters.alpha.opacity';


und

Code:

OB.attr   = 'style.MozOpacity';


den OB ist das aktuelle Objekt.d.h. immer das Bild da (this) übergeben wird.
die programmierung fragt über >.attr < den wert ab. ist dieser so nicht vorhanden klappt das nicht.
wie wird das denn in dem bsp welches ich dir geschickt hatte gelöst?


//ok das bsp von mir ist das selbe.
wie schaut es bei dir mit jQuery kenntnissen aus?
das wäre mit 4-5 zeilen code zu lösen.


Zuletzt bearbeitet von Kash am Do 13.11.2008 11:34, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen jQuery Fade Effekt
[SWISH] Rollover i.V.m. Fade-Effekt
Fade-In Effekt soll im FF auch funktionieren
Fade-Out Effekt beim Scrollen - aber wie... ?
Javascript Hyperlink Fade // Slide Effekt
Dringend: Brauche Hilfe bei JS (Fade Effekt)
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2, 3, 4, 5, 6  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.