[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: 3 колонки текста в одном блоке CSS / JS ?
Por$h
Новая проблема:
вот что должно получиться - картинка

проблема следующая:
как с помощью css или JS расположить текст в 3 колонки, как на картинке, если текст дается сплошняком JSON, т.е всё в один тег div должно загружаться,а не в 3 разных для колонок.
вообщем вот http://jsfiddle.net/53BR9/3/

есть идеи ?
sergeiss
У меня даже где-то валяется функция JS, которая это делает smile.gif Но я ее просто так не отдам. 1500 р.

Алгоритм простой, можешь сам сделать.
1. Передаю функции текст список ДИВов, которые будут использоваться.
2. Начинаю выводить текст по одному слову. Если у ДИВа появляются полосы прокрутки, то последнее слово - лишнее. Убираю его из вывода в первый ДИВ. Беру это слово, и начиная с него, вывожу текст во второй ДИВ. До тех пор, пока опять не появятся полосы прокрутки. Ну и так далее, пока либо все ДИВы не будут заполнены, либо не закончится текст.
3. И располагай ДИВы так, как удобно: рядом друг с другом, лесенкой, вокруг круга... Также они могут быть разного размера.
4. Грузи только данные не в ДИВ, а в переменную, которую будешь передавать этой функции.
5. При ресайзе БОДИ (если это приводит к ресайзу элементов) надо вызывать эту же функцию с использованными ранее парамерами, чтобы перерисовать всё.

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

user posted image
glock18
Элементарно делается цссом в полторы строчки, если вопрос поддержки css3 не поднимается.
Por$h
glock18
мм можете рассказать как css ом ?
batazor
Или вот так http://habrahabr.ru/post/153955/ или http://habrahabr.ru/company/microsoft/blog/143158/
Por$h
glock18 , batazor
спасибо, решение подходит.
html5 shiv же не поможет для IE8 хотя бы ?
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.