ilch Forum » Allgemein » HTML, PHP, SQL,... » Input hover

Geschlossen
  1. Do. 21.04.2011 01:45 Uhr #1
    User Pic
    Chester Mitglied
    Registriert seit
    17.02.2009
    Beiträge
    753
    Beitragswertungen
    19 Beitragspunkte
    Hallo,

    ich hab mich jetzt wie wild durchs web geklickt und jedesmal finde ich nur sachen wo ich anhand von css ein hover in einem input feld erzeugen kann.

    Das soll aber in einigen browsern nicht funktionieren. Hat jemand ne idee wie man das mit javascript hinkrigt?

    Wäre sehr nett lächeln
    LD on Deviantart
    0 Mitglieder finden den Beitrag gut.
  2. Do. 21.04.2011 07:42 Uhr #2
    User Pic
    Lord|Schirmer Administrator
    Registriert seit
    21.03.2007
    Beiträge
    7.680
    Beitragswertungen
    1216 Beitragspunkte
    Du meinst so? 
    <style>#input { background-color:aqua; border:1px green dotted; }</style>
<div onmouseover="document.getElementById('input').style.backgroundColor='red'" onmouseout="document.getElementById('input').style.backgroundColor='aqua'">
<input id="input" /></div>


    ... es gibt aber gute/bessere Jquery Lösungen!
    rules :: doku :: faq :: linkus
    0 Mitglieder finden den Beitrag gut.
  3. Do. 21.04.2011 12:15 Uhr #3
    User Pic
    Chester Mitglied
    Registriert seit
    17.02.2009
    Beiträge
    753
    Beitragswertungen
    19 Beitragspunkte
    und warum sind diese besser und wie sähen sie da aus?
    LD on Deviantart
    0 Mitglieder finden den Beitrag gut.
  4. Do. 21.04.2011 12:31 Uhr #4
    User Pic
    Treicio gelöschter User
    ist eigentlich das selbe wie normal mit css^^
    Lord|Schirmers Variante ändert einfach nur die Styleeigenschaften bei Mouseover und Mouseout :-)
    0 Mitglieder finden den Beitrag gut.
  5. Do. 21.04.2011 13:02 Uhr #5
    User Pic
    dastiii Mitglied
    Registriert seit
    27.12.2005
    Beiträge
    2.354
    Beitragswertungen
    84 Beitragspunkte
    Super. Und wie du wissen solltest (und sogar im Eröffnungspost steht) funktioniert die reine CSS-Methode nicht in jedem Browser, verstehe deine Antwort jetzt nicht...
    externer Link
    0 Mitglieder finden den Beitrag gut.
  6. Do. 21.04.2011 17:29 Uhr #6
    User Pic
    Jan Hall Of Fame
    Registriert seit
    17.01.2007
    Beiträge
    3.646
    Beitragswertungen
    54 Beitragspunkte
    ZitatZitat geschrieben von DaStIaC
    Super. Und wie du wissen solltest (und sogar im Eröffnungspost steht) funktioniert die reine CSS-Methode nicht in jedem Browser, verstehe deine Antwort jetzt nicht...

    Wo siehst du in dem Post von Lord Schirmer reines css?

    Lord schirmers Variante funktioniert mit Javascript.
    0 Mitglieder finden den Beitrag gut.
  7. Do. 21.04.2011 17:47 Uhr #7
    User Pic
    dastiii Mitglied
    Registriert seit
    27.12.2005
    Beiträge
    2.354
    Beitragswertungen
    84 Beitragspunkte
    ERÖFFNUNGSPOST.

    Lesen muss schwer sein.
    externer Link
    0 Mitglieder finden den Beitrag gut.
  8. Do. 21.04.2011 17:52 Uhr #8
    User Pic
    Jan Hall Of Fame
    Registriert seit
    17.01.2007
    Beiträge
    3.646
    Beitragswertungen
    54 Beitragspunkte
    Ruhig ... Alles wird gut.
    0 Mitglieder finden den Beitrag gut.
  9. Do. 21.04.2011 18:43 Uhr #9
    User Pic
    SeToY Mitglied
    Registriert seit
    29.06.2006
    Beiträge
    1.928
    Beitragswertungen
    43 Beitragspunkte
    ZitatZitat geschrieben von jankrug

    Ruhig ... Alles wird gut.


    Es gibt halt choleriker zwinker
    0 Mitglieder finden den Beitrag gut.
  10. Do. 21.04.2011 18:54 Uhr #10
    User Pic
    dastiii Mitglied
    Registriert seit
    27.12.2005
    Beiträge
    2.354
    Beitragswertungen
    84 Beitragspunkte
    Und die Forentrolls wie du es bist. Was verschlägt dich denn in dieses Forum, sonst hältst du dich doch nur in der Plauderecke auf. ;-)

    Um nochmal aufs Thema einzugehen:

    LordSchirmer meinte wohl einfach, dass das mit jQuery generell besser ist und eben den Sourcecode nicht so aufbläht. Nutzt du generell mehr Javascript? Wenn nicht wärs halt sone Sache ob sich das überhaupt lohnt für ne handvoll Mouseovers extra nen JS-Framework einzubinden.


    Zuletzt modifiziert von DaStIaC am 21.04.2011 - 18:55:13
    externer Link
    0 Mitglieder finden den Beitrag gut.
  11. Do. 21.04.2011 19:47 Uhr #11
    User Pic
    SeToY Mitglied
    Registriert seit
    29.06.2006
    Beiträge
    1.928
    Beitragswertungen
    43 Beitragspunkte
    ZitatZitat geschrieben von DaStIaC

    Und die Forentrolls wie du es bist. Was verschlägt dich denn in dieses Forum, sonst hältst du dich doch nur in der Plauderecke auf. ;-)


    Was mich in dieses Forum verschlägt... Hmm... gute Frage.

    Wenn du die Kategorie des Ilch-Forums meinst (HTML, PHP, SQL,...) - ich hab hier schon öfter mein Unwesen getrieben zwinker
    0 Mitglieder finden den Beitrag gut.
  12. Do. 21.04.2011 22:48 Uhr #12
    User Pic
    Chester Mitglied
    Registriert seit
    17.02.2009
    Beiträge
    753
    Beitragswertungen
    19 Beitragspunkte
    also ich nutze recht viel javascript weil ichs cool finde lachen Das sieht alles so krass animiert aus zunge

    Deswegen bin ich sehr gespannt was lord|schirmer da meint. Weil ich kenne keine jquery scripte in die richtung.
    LD on Deviantart
    0 Mitglieder finden den Beitrag gut.
  13. Do. 21.04.2011 23:40 Uhr #13
    User Pic
    Lord|Schirmer Administrator
    Registriert seit
    21.03.2007
    Beiträge
    7.680
    Beitragswertungen
    1216 Beitragspunkte
    Ich habe Dir mal ein Beispiel gebastelt ... der Möglichkeiten & Ideen gibt es ja viele! 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js" type="text/javascript"></script>
<script>
$(function(){
    $('input.name, input.email, input.website, textarea.area').focus(function() {
        $(this).stop().animate({ backgroundColor: '#66CCFF' }, 250);}).blur(function() {
            $(this).stop().animate({ backgroundColor: '#FFCC99' }, 250);
            });
    });
</script>
</head>

<body>
<label style="float:left; width:100px;">Name:</label><input class="name" type="text" /><br />
<label style="float:left; width:100px;">Email: </label><input class="email" type="text" /><br />
<label style="float:left; width:100px;">WebSite: </label><input class="email" type="website" /><br />
<label style="float:left; width:100px;">Text: </label><textarea class="area"></textarea>
</body>

</html>
    rules :: doku :: faq :: linkus
    0 Mitglieder finden den Beitrag gut.
  14. Fr. 22.04.2011 00:26 Uhr #14
    User Pic
    Chester Mitglied
    Registriert seit
    17.02.2009
    Beiträge
    753
    Beitragswertungen
    19 Beitragspunkte
    ok wenn ich das mit einem image machen will, wie muss ich das dann machen?

    { backgroundImage: 'url(loginimg.gif)' }

    funktioniert nälich leider nicht traurig

    ich will nämlich einen loginbuton mit hover effekt.

    aber erstmal danke für die Mühe glücklich


    Zuletzt modifiziert von Chester am 22.04.2011 - 00:28:10
    LD on Deviantart
    0 Mitglieder finden den Beitrag gut.
  15. Fr. 22.04.2011 08:05 Uhr #15
    User Pic
    Lord|Schirmer Administrator
    Registriert seit
    21.03.2007
    Beiträge
    7.680
    Beitragswertungen
    1216 Beitragspunkte
    Background per css definieren!
    Hier mal ein Linkals Ideengeber!
    rules :: doku :: faq :: linkus
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu HTML, PHP, SQL,...

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten