Ergebnis 1 bis 5 von 5

Thema: css3 keyframes safari

  1. #1
    Contao-Nutzer
    Registriert seit
    20.02.2014.
    Beiträge
    90

    Standard css3 keyframes safari

    liebe community!

    ich versuche gerade, ein paar individuellen elementen ein wenig "schwung" einzuhauchen und dachte, ich mache das mit css3 animationen.
    bei chrome, firefox und opera funktionieren meine angaben auch (unterschiedliche präfixe) !!bestens!! - nur mit safari hab ich meine lieben probleme: es will sich nix bewegen.
    habe schon einiges nachgelesen, etwa dass zumindest safari v4 und safari v5 ganz gut laufen auch ohne präfix, nur bei v6 muss man "-webkit" als präfix davorhängen und auch, dass man von 0 - 100% gehen muss und bei safari nicht bei z.b. 80% aufhören kann aber auch mit präfix geht es nicht. kann mir jemand einen hinweis geben was ich übersehen habe? mein technisches englisch ist leider nicht herausragend also habe ich beim nachforschen im web wahrscheinlich schon hinweise übersehen..


    meine angaben

    @-webkit-keyframes running {

    0% { transform: translateX(80px)}
    50% { transform: translateX(330px)}
    100% { transform: translateX(580px)}

    }


    .klasseobjekt {

    -webkit-animation: running;
    -webkit-animation-duration: 2s;
    -webkit-animation-direction: right;
    -webkit-animation-timing-function: ease-out;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-delay: 2s;

    }
    Geändert von dereo (06.08.2014 um 08:53 Uhr)

  2. #2
    Contao-Urgestein Avatar von KATgirl
    Registriert seit
    31.03.2010.
    Ort
    Marburg
    Beiträge
    1.579
    User beschenken
    Wunschliste
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Vielleicht hilft dir das:
    - http://www.smashingmagazine.com/sear...%3A10&ie=UTF-8

    Ist zwar auch auf englisch aber die Beispiele sind sehr anschaulich.

    Gesendet von meinem Nexus 7 mit Tapatalk
    - GitHub
    - Kontaktanfragen

    "Ein Lächeln ist die kürzeste Entfernung zwischen zwei Menschen." Victor Borge

  3. #3
    Contao-Nutzer
    Registriert seit
    20.02.2014.
    Beiträge
    90

    Standard

    vielen dank für den hinweis. die dortigen vorschläge sind aber teilweise schon sehr veraltet und bei safari 4 und safari 5 funktionieren die vorgeschlagenen tipps eh nur bei safari 6+ gibt es probleme.
    mittlerweile bin ich aber durch experimentieren drauf gekommen, dass das präfix auch zum transform-befehl dazugehört

    also für safari { -webkit-transform: translateX } bzw. dann für firefox { -moz-transform: translateX }

    bei vielen beispielen im netz wurde das entweder vergessen zu erwähnen oder als selbstverständlich erachtet und nur die grundform zur verfügung gestellt, bei manchen seiten steht aber sogar, dass safari ohne präfix funktioniert - das stimmt schlichtweg nicht.

  4. #4
    Community-Moderatorin & Contao-Urgestein Avatar von mlweb
    Registriert seit
    10.07.2011.
    Beiträge
    6.758
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Schau mal hier www.caniuse.com/#search=translate.
    Demnach braucht Safari auf jeden Fall noch ein Prefix.
    Die Internetseite ist für mich immer die Quelle für so etwas. Die wird sehr gut gepflegt.
    Ich habe Dir mit meinen Hinweisen geholfen und Du möchtest Dich bedanken?
    Unterstütze bitte das Contao-Projekt (Button Links)
    Weitere Spendenmöglichkeiten
    ------------------------------------------------------------------------------------------------------
    Contao-Dokumentation: Contao-Handbuch und Contao-Entwickler-Doku
    Contao-Online-Video-Kurse: Contao Academy
    Funktionalität erweitern: Contao-Erweiterungen

    Für Dinge die man mit html5 und css3 lösen kann, braucht man kein javascript.




  5. #5
    Contao-Nutzer
    Registriert seit
    20.02.2014.
    Beiträge
    90

    Standard

    darauf bin ich schon gestoßen aber ich habe nicht bedacht, präfixe schon bei der vorhergehenden definition zu verwenden und bin davon ausgegangen, dass es ausreicht, dies beim betreffenden objekt zu erledigen.
    danke jedenfalls für die antwort und den link - auch für andere, die ähnliche fragen haben
    Geändert von dereo (06.08.2014 um 08:55 Uhr)

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •