Animierte Strichzeichnung mit jQuery
Will ich mit jQuery einen Effekt zu erstellen, der eine Strichzeichnung gezeichnet, als ob von einem unsichtbaren Stift.
Art wie diese:
http://d2fhka9tf2vaj2.cloudfront.net/tuts/152_QTiPad/Milestones/JavaScriptWebsite.html
Habe ich dieses mock-up mit einigen anderen Bibliothek, aber ich Frage mich, ob es ist ein einfacher Weg, das zu tun, mit jQuery. Und ich möchte auch in der Lage sein zu animieren, gekrümmte und unregelmäßige Linien.
Möchte ich animieren, eine Zeichnung wie diese, zum Beispiel:
http://commons.wikimedia.org/wiki/File:Mouse_line_drawing.jpg
Gibt es ein jQuery-plugin, das hilft, erstellen Sie eine solche Wirkung?
Wenn nicht, können Sie die Beratung eine einfache und effektive Art und Weise zu tun, die mit jQuery?
Danke für deine Tipps!
Beste Grüße,
Dimitri Vorontzov
Du musst angemeldet sein, um einen Kommentar abzugeben.
Haben Sie einen Blick auf Raphael.
Habe ich versucht zu reproduzieren, der diese animation. Ich benutzt ein div, in dem ich platziert 4 "border-divs", mit
position: absolute
Sie als Rahmen.All diese "Grenze-divs" haben eine Breite von 0px, und ein
1px solid black
Grenze.Wenn der DOM fertig ist, ich animiere die Grenze-divs eins nach dem anderen, ändern Ihre Größe, um den container mit den Abmessungen:
Ich weiß nicht, ob ich bin klar, Englisch ist nicht meine Muttersprache, aber ich habe eine jsBin-Beispiel hier
Alles, was Sie jetzt tun müssen, ist wiederholen Sie den Vorgang auf der gesamten website !
jQuery.animate()
. Für komplexere Formen, die Zeichnung in einsvg
eine gute Lösung sein (siehe Rasika Antwort)Ziemlich altes Thema, aber ich fand diese cluld werden Lösung: http://plugins.jquery.com/lazylinepainter/