mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Sa 27.04.2024 10:22 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: Zurück  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 14:26
Titel

Antworten mit Zitat Zum Seitenanfang

mal noch ne frage, kann man in dem js auch eine farbüberlagerung einfügen? also die bilder sollen nicht nur transparent sein, sondern dass sie entweder grau und hellblau dann sind... geht das?
  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 14:53
Titel

Antworten mit Zitat Zum Seitenanfang

setz das bild in ein blockelement und vergib dem einen hintergrund

ungefähr so

Code:


$("div").css("background","#ff0000");





// bei der lösung hat mein blockelement die selbe größe wie das bild welches es beinhaltet

Code:

<script type="text/javascript" language="javascript">
      $(document).ready(function() {
         $("img").mouseover(function(){
            $(this).animate({
                 opacity: 0.4,
            }, 500 );
                               $("div").mouseover(function(){
               $("div").css("background","#ff0000");
            });
         });
         
         $("img").mouseout(function(){
            $(this).animate({
                 opacity: 1.0,
              }, 500 );
         });
      });
</script>


Zuletzt bearbeitet von Kash am Do 13.11.2008 15:48, insgesamt 5-mal bearbeitet
  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 15:01
Titel

Antworten mit Zitat Zum Seitenanfang

das heißt ich muss jetzt alle bilder in ein div setzen?
  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 15:03
Titel

Antworten mit Zitat Zum Seitenanfang

nicht unbedingt ein div.. kann auch etwas anderes sein.
ansprechen kannst du (wenn div) durch die klasse.

(kein IDs, denn die dürfen nur einmal verwendet werden)

Code:

<script type="text/javascript" language="javascript">
      $(document).ready(function() {
         $("img").mouseover(function(){
            $(this).animate({
                 opacity: 0.4,
            }, 500 );
                                $(".name").mouseover(function(){
               $(this).css("background","#ff0000");
            });
         });
         
         $("img").mouseout(function(){
            $(this).animate({
                 opacity: 1.0,
              }, 500 );
         });
      });
</script>



Code:

<div class="name"><img src="image.gif" alt="" /></div>
<br /><br />
<div class="name"><img src="image.gif" alt="" /></div>


so in etwa


Zuletzt bearbeitet von Kash am Do 13.11.2008 15:48, insgesamt 5-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 15:11
Titel

Antworten mit Zitat Zum Seitenanfang

mhmm irgendwie klappt das ganz und garnicht wie es sein soll... wenn ich drüber fahre kommt erst die farbe, die soll ja aber schon am anfang da sein... und wenn ich dann einmal drüber gefahren bin bleibt das bild dunkel..


naja vor allem legt sich da zwar was drüber, aber das bild soll ja die farbe verlieren also nur grau oder so...


Zuletzt bearbeitet von denise2302 am Do 13.11.2008 15:16, 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 15:17
Titel

Antworten mit Zitat Zum Seitenanfang

also so klappt es bei mir

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
   <meta http-equiv="Content-type" content="text/html; charset=ISO-8859-1" />
   <title>jQuery - Tests</title>
   <meta http-equiv="Content-Language" content="de" />
   <meta http-equiv="imagetoolbar" content="no" />
   <meta name="MSSmartTagsPreventParsing" content="true" />
   <meta name="description" content="" />
   <meta name="keywords" content="" />
   <meta name="author" content="..." />
   <style type="text/css" media="all">
      * {
         margin:0;
         padding:0;
      }
      
      .name {
         max-height:170px;
         width:255px;
      }
   </style>
   <script type="text/javascript" src="library/jquery-1.2.6.js"></script>
     <script type="text/javascript" language="javascript">
      $(document).ready(function() {
         $("img").mouseover(function(){
            $(this).animate({
                 opacity: 0.4,
            }, 500 );
                                $(".name").mouseover(function(){
               $(this).css("background","#ff0000");
            });
         });
         
         $("img").mouseout(function(){
            $(this).animate({
                 opacity: 1.0,
              }, 500 );
         });
      });
   </script>
   
</head>
<body>
   <div class="name"><img src="image.gif" alt="" /></div>
   <br /><br />
   <div class="name"><img src="image.gif" alt="" /></div>
</body>
</html>


Zuletzt bearbeitet von Kash am Do 13.11.2008 15:48, insgesamt 2-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 15:19
Titel

Antworten mit Zitat Zum Seitenanfang

ich denke ich verstehe dich nur wieder mal nicht Ooops
  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 15:22
Titel

Antworten mit Zitat Zum Seitenanfang

naja kann man durch irgendeinem befehl das img in graustufen anzeigen lassen? also von anfang an, dass es in graustufen ist dann kommt mouseover es wird farbig und dunkel und wenn man es wieder verlässt wird es wieder grau und hell ^^ (oder wenns geht halt nicht grau sondern ne andere farbe aber wenn man graustufen daraus machen könnte das würde mir schon reichen)

und ich habe gerad mal deins ausprobiert, da wird es auch erst rot, wenn man drüber fährt..


Zuletzt bearbeitet von denise2302 am Do 13.11.2008 15:26, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen jQuery Fade Effekt
[SWISH] Rollover i.V.m. Fade-Effekt
Fade-Out Effekt beim Scrollen - aber wie... ?
Javascript Hyperlink Fade // Slide Effekt
Dringend: Brauche Hilfe bei JS (Fade Effekt)
Fade-In Effekt soll im FF auch funktionieren
Neues Thema eröffnen   Neue Antwort erstellen Seite: Zurück  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.