Дмитрий Ш.
14 сообщений
#15 лет назад


Есть вот такая шапка

Логотип всегда стоит на месте и никуда не движется. Теги же должны быть раскиданы по шапке, не задевая при этом логотип и не вылезая за шапку. Тегов может быть разное количество и всегда они должны быть раскиданы по-разному.

Как такое можно реализовать? о_О
Роман Беляев
16382 сообщения
#15 лет назад
Цитата ("DIVst"):
Как такое можно реализовать? о_О


а зачем? :o выглядит жутковато.
Дмитрий Ш.
14 сообщений
#15 лет назад
Цитата ("frig"):
а зачем?

Не знаю... У меня задача только сверстать
Виталий Я.
659 сообщений
#15 лет назад
Javascript , делаете несколько контейнеров , один минимально возможного размера для лого , по ним разбрасываете теги скриптом через style , и атрибуты top и left . Както так
Максим Ф.
3195 сообщений
#15 лет назад
Цитата ("DIVst"):
У меня задача только сверстат

В вёрстку уже входит программирование? Круто...
Артем Л.
11416 сообщений
#15 лет назад
Цитата ("DIVst"):
У меня задача только сверстать

Это задача программиста а не верстальщика...
Дмитрий Войциховский
2128 сообщений
#15 лет назад
А побольше входных данных дадите? Что позволено использовать? (строго только html - нереально в динамике вообще, через php+smarty - можно поизвращаться).
Что значит "Тегов может быть разное количество и всегда они должны быть раскиданы по-разному" - откуда берутся данные (сами тэги), разное количество в разумных рамках, или может быть и все 100-200, что насчет резиновости дизайна (да или нет, в каких пределах, что с тэгами должно происходить при резине) и так далее?
При такой постановке задачи, как дано сейчас, могу только посоветовать все-таки количество тэгов зафиксировать, тэги пронумеровать, привязать каждый номер рэндомным образом в рамках четко обозначенного места (т.е. каждый тэг случайным образом появляется в границах отведенного ему места). Это самое простое.
Кирилл Е.
2817 сообщений
#15 лет назад
Цитата ("DIVst"):
У меня задача только сверстать

Только и верстайте.. точно так - как на картинке.

Но если делать - яскриптом можно такое сделать.

На входе - список тегов, типа ссылка:заголовок_тега.
Задаёте координаты, в приделах которых будут ваши теги.
Задаёте координаты логотипа (в приделах которых тегов не будет.

Далее рандомно получили координаты для размещения тегов и их стиль - делаете поправку:
размещает на шапке тег.
Исходя из стиля, берём его ширину\высоту: jQuery('#teg_1'.attr('offsetWidth'; jQuery('#teg_1'.attr('offsetHeight'; так-же считаем координаты.
- вылазит тег за общие приделы всего блока - подвигает во "внутрь"
- вылазит тег на логотип - подвигаем за пределы логотипа.

тег-1 размещён. зону этого тега заносим в отдельный массив, чтобы следующий тег не "налез" на размещённый.

В общем как-то так.. это первое что в голову пришло.
Кирилл Е.
2817 сообщений
#15 лет назад
Думаю есть готовые плагины на яквери, чтобы не изобретать велосипед - погуглите 10 минут, уверен найдётся решений.