Как сделать динамическую прокрутку текста на кривой в HTML / Javascript / CSS?

Question

Я пытаюсь сделать динамическую прокрутку текста на странице. Я хочу, чтобы он прокручивался на изогнутой и наклонной поверхности ради дизайна. Придется ли мне использовать вспышку для этого? Потому что я бы не хотел.

Answer 1

Должны ли символы вращаться вместе с кривой? Получение символов текста по изогнутой траектории (без поворота) возможно с помощью JavaScript. Если текст должен вращаться, вы можете сделать это с VML / SVG / Canvas, но в этом случае вам может быть лучше с Flash.

Это не совсем то, что вам нужно, но посмотрите, как ведет себя текст, и вы поймете, что я имею в виду, не вращаясь: http://s.blixt.org/physics-enabled-html/

---

У меня есть идея сделать что-то, что может или не может быть то, о чем вы думали, но это может помочь вам:

http://blixt.org/js/path.html

Он ищет элементы с атрибутом data-path ( HTML 5: data-* атрибуты ) и анализирует его, чтобы создать путь для перемещения текста.

Я также обновил его, добавив ротацию с использованием CSS3 для браузеров, которые его поддерживают (последние браузеры Mozilla и WebKit.)

Answer 2

Ну, вы можете анимировать каждую букву или пару букв. Это выполнимо, но было бы намного эффективнее / быстрее с Flash. Вы должны были бы сделать математическое представление кривой.

Это действительно необходимо? Перепрошивка / перемещение текста на самом деле не считается хорошей дизайнерской практикой. Конечно, есть исключения.

Edit:

См. Комментарии для большего количества указателей на решение.