mediengestalter.info
Datenschutzerklärung
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter
Aktuelles Datum und Uhrzeit: Di 16.04.2024 18:41 Benutzername: Passwort: Auto-Login

Thema: [jQuery] - animate/backgroundColor vom 28.07.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> [jQuery] - animate/backgroundColor
Autor Nachricht
Kash
Threadersteller

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Di 28.07.2009 13:35
Titel

[jQuery] - animate/backgroundColor

 Antworten mit Zitat Zum Seitenanfang
Hallo zusammen,

im Zuge einer Formularüberprüfung möchte ich, wenn der Benutzer ein Pflichtfeld verläßt und dieses nicht ausfüllt,
die Hintergrundfarbe ändern.

Dieses wollte ich mittels jQuery und animate bewerkstelligen.
Jetzt ist es ja so das die jQuery Library keine Funktion mitbringt um Farben zu animieren.

Dazu includiere ich mir die jQuery UI von google.

Code:

<!-- include Google's AJAX API loader -->
<script src="http://www.google.com/jsapi"></script>
<!-- load JQuery and UI from Google (need to use UI to animate colors) -->
<script type="text/javascript">
   google.load("jqueryui", "1.5.2");
</script>


Leider passiert bisher immer noch nichts.

mein javascript

Code:

function checkform()
      {
         if(document.getElementById('M_01_name').value == 0)
         {
            $(document).ready(function() {
               $('#M_01_name').animate( {
                  backgroundColor: "#F6A28C"
                  }, 400 );
            });
         }
      }


Es gibt von JQuery selbst auch ein Plugin zum animieren von Farben

http://plugins.jquery.com/project/color

bei dem habe ich gelesen geht die Performance aber stark flöten.
Und möchte wenn es eine andere Lösung geht darauf verzichten.

Auch möchte ich keine Hintergrundbilder verwenden, da der Kunde später selbst bestimmen kann in welcher Farbe seine Eingabefelder erscheinen.
  View user's profile Private Nachricht senden
pixelpapst303

Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht: Männlich
Verfasst Di 28.07.2009 13:59
Titel

Antworten mit Zitat Zum Seitenanfang
lege ein array mit den farbwerten der animation zurecht, und schreibe eine rekursive funktion, die sich mitn paar millisekunden verzögerung solange aufruft, bis das array durchgelaufen wurde und mit this.css die farbe angepasst hat.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
Kash
Threadersteller

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Di 28.07.2009 14:48
Titel

Antworten mit Zitat Zum Seitenanfang
das heißt ich lege nach und nach farbwerte übereinander bis der ton den ich haben möchte angezeigt wird?
ist das nicht ein wenig too much für das vorhaben?

solange sich die Eingabefelder in Grenzen halten, könnte ich das plugin von jQuery nutzen,
nur bei mehr als 100 gibts irgendwie probleme.
  View user's profile Private Nachricht senden
Pixelpole

Dabei seit: 25.10.2004
Ort: Trier
Alter: 37
Geschlecht: Männlich
Verfasst Di 28.07.2009 14:54
Titel

Antworten mit Zitat Zum Seitenanfang
nimm das plugin. Kann mir kaum vorstellen das dein Formular so lang ist das du auf Probleme stoßen könntest *zwinker*
  View user's profile Private Nachricht senden
Kash
Threadersteller

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Di 28.07.2009 14:58
Titel

Antworten mit Zitat Zum Seitenanfang
Pixelpole hat geschrieben:
nimm das plugin. Kann mir kaum vorstellen das dein Formular so lang ist das du auf Probleme stoßen könntest *zwinker*


der Kunde kann das später selber pflegen.
d.h. er kann über eine Adminoberfläche die Anzahl etc selbst bestimmen.
ich weiß ja nicht was er später damit vor hat. und wieviele der felder er als Pflichtfelder deklariert.

aber ich denke ich nehme auch das Plugin.
und wenn er später wirklich probleme haben sollte guck ich mir das nochma an * Ööhm... ja? *
  View user's profile Private Nachricht senden
lehanky

Dabei seit: 08.10.2009
Ort: -
Alter: -
Geschlecht: -
Verfasst Do 08.10.2009 12:26
Titel

Antworten mit Zitat Zum Seitenanfang
du kannst es auch mal mit $(this).addClass('irgendeinklassenname'); versuchen und dann in der css
die background-color bestimmen. Funktioniert einwandfrei.
  View user's profile Private Nachricht senden
Kash
Threadersteller

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Do 08.10.2009 13:02
Titel

Antworten mit Zitat Zum Seitenanfang
Danke für die Antwort.

Aber der Einsatz dieses Plugins hat sich bisher als die beste Lösung bewiesen.

Gibt keine Probleme bisher die mir bekannt sind.
  View user's profile Private Nachricht senden
 
Ähnliche Themen jQuery animate/fadeOut-Problem
jQuery: fadeTo bzw. animate(opacity) geht nicht im IE
remove hover-backgroundColor onClick
Animate CC Rise-Ad mit Videoinhalten?
Farbverlauf mit Edge Animate
Adober Animate: Objekte zuschneiden
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


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.

Mediengestalter.info ist ein Projekt von Webformatik :: Forensoftware: phpBB