Как верстать подобные вещи?

Question

[BigCrazyCat]

Как верстать подобные вещи? Онли CSS + JS?

Comments

[petyagrill]

Как ни крути, но без HTML тут никак

[petyagrill]

ну а если серьезно, то не вижу конкретного вопроса. Что есть, что получилось, что не получилось?

[Damir Aushenov]

Как верстать подобные вещи? Онли CSS + JS? + HTML
Красивый UI

Answer 1

[Денис Инешин]

HTML+CSS3 - основа
SVG/Canvas - для сложных, нестандартных эффектов (вроде графиков или размытых фонов).

А так, многие из этих эффектов, особенно если они статичны, можно просто вставлять фоновыми картинками и всё. Всегда так делали. Очень сложно в браузере повторить то, что дизайнер нарисовал в фотошопе на сотне слоев.

Answer 2

[titronfan]

Дивами =)

Answer 3

[GreatRash]

Я так понимаю речь идёт о блюре...

1) Если у вас в приоритете быстродействие, то лучше вообще так не делать. Ибо этот эффект дико медленный.
2) Если на быстродействие пофиг, то можно заюзать фильтры.
3) Если на странице при этом отсутствует скролл, или вы точно знаете где будут располагаться элементы, или элементы вообще никогда не будут менять своего положения, то можно сделать две картинки (обычную и заблюреную) и показывать одну как фон блока, а вторую как фон элемента над этим блоком. Типа того.

Единственное уточнение: для всех трёх случаев обязателен достаточно новый браузер (IE8+) ибо нужна поддержка правила background-position: fixed.