Вы, конечно, знаете о свободной карте OpenStreetMap. Это настоящая народная карта, создаваемая такими же людьми как и вы! Это такой же opensource-проект как Linux и как Википедия.
Конечно же, как и в других картах, в OpenStreetMap имеются ошибки, но в отличие от тех же Яндекс.Карт, где ошибки не исправляются годами из-за сложной бюрократической процедуры (я уже не говорю о намеренных ошибках), в OpenStreetMap всё гораздо проще и лучше для всех нас...
Подробнее..
Не так давно CloudMade выделил несколько приоритетных направлений, среди которых оказалась и навигация. Решено было создать специальный проект Navi Studio, который объединял бы в себе несколько более мелких сервисов и позволял пользоваться ими, для создания полноценного навигационного программного обеспечения. В Navi Studio вошли:
Работа закипела и уже появилось несколько приложений использующих данный проект. Но полноценной навигации без соблюдения правил ПДД не существует, а потому данному вопросу было также уделено не мало времени...
Подробнее..
Недавно наткнулся в сети на один занимательный интернет-сервис, именующийся Web 2.0 Suicide machine . Предназначен он для того, чтобы позволить людям, обремененным «социальной жизнью в интернете», в пару кликов удалить свои аккаунты на Facebook (в данный момент сервис блокирован администрацией по IP), Twitter, Linkedin
и Myspace. В общем-то судя по количеству положительных отзывов и «успешных очищений» — пипл хавает зависимые от социальных сетей успешно пользуются сервисом и довольны...
Подробнее..
До того как заняться верской гитарных аккордов (статьи 1,2,3) я столкнулся с необходимостью сделать человеку на сайте меню-дерево. Рисовать не хотелось вообще, поэтому я взял старый добрый HTML с CSS и начал делать это дерево, начал с простого одноуровневого, а позже сделал многоуровневое с маркерами, которое и представлю.
Позже это дерево дало мне плоды в виде <a href=«r3code.habrahabr.ru/blog/537
В реализации используется исключительно HTML и CSS, никаких картинок.
Для отрисовки маркера раскрытия списка использовал CSS прием с границами нулевого размера блока.
<div id= multi-derevo >
<h4><a href= # >Ствол дерева</a></h4>
<ul>
<li><span><a href= #1 ><em class= marker open ></em>1. Ветка</a></span>
<ul>
<li><span><a href= #11 class= current title= Выбранный раздел ><em class= marker open ></em>1.1. Ветка</a></span>
<ul>
<li><span><a href= #111 >1.1.1. Листик</a></span></li>
<li><span><a href= #112 >1.1.2. Листик</a></span></li>
</ul>
</li>
<li><span><a href= #12 >1.2. Ветка</a></span></li>
</ul>
</li>
<li><span><a href= #2 ><em class= marker ></em>2. Ветка</a></span></li>
<li><span><a href= #3 ><em class= marker ></em>3. Ветка</a></span></li>
<li><span><a href= #4 ><em class= marker ></em>4. Ветка</a></span></li>
<li class= last ><span><a href= #5 title= Послледняя ветка ><em class= marker open ></em>5. Ветка, верхушка</a></span>
<ul>
<li><span><a href= #1 >5.1. Ветка</a></span></li>
<li><span><a href= #1 >5.2. Ветка</a></span></li>
</ul>
</li>
</ul>
</div><!-- /multi-derevo -->
* This source code was highlighted with Source Code Highlighter.
/* общий стиль */
body {font-family: Arial, Tahoma, sans-serif; margin: 2em; font-size: 62.5%;}
p {
font-size: 1.2em;
}
a {
color: #0066cc;
text-decoration: none;
outline: none;
}
/*a:link {
color: #0066cc;
}
a:visited {color: #00cc63; }*/
a:hover {
text-decoration: underline;
}
a:active, a:focus {
color: #666;
background-color: #f4f4f4;
}
a.current {
color: black;
font-weight: bold;
}
/* Дерево многоуровневое
-------------------------------- */
#multi-derevo {
width: 220px; /* блок под дерево */
border: solid; /* границы блока */
border-color: silver gray gray silver;
border-width: 2px;
padding: 0 0 1em 0; /* нижний отступ */
font-size: 1.3em;
}
span { /* обертка пункта */
text-decoration: none;
display: block; /* растянем до правого края блока */
margin: 0 0 0 1.2em;
background-color: transparent;
border: solid silver; /* цвет линий */
border-width: 0 0 1px 1px; /* границы: низ и лево */
}
span a {/* тест элемента дерева */
display: block;
position: relative;
top: .95em; /* смещаем узел на середину линии */
background-color: #fff; /* закраска в цвет фона обязательна иначе будет видно линию */
margin: 0 0 .2em .7em; /* делаем промежуток между узлами, отодвигаем левее */
padding: 0 0.3em; /* небольшой отступ от линии */
}
h4 {/* заголовок дерева */
font-size: 1em;
font-weight: bold;
margin: 0;
padding: 0 .25em;
border-bottom: 1px solid silver;
}
h4 a {
display: block;
}
ul, li {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0;
padding:0;
}
ul li {
line-height: 1.2em;
}
ul li ul {}
ul li ul li {
margin: 0 0 0 1.2em;
border-left: 1px solid silver; /* цвет вертикальной линии между узлами */
}
ul li.last ul li {/* последний узел, соединительную линию к след. узлу убираем */
border: none;
}
.marker { /* маркер раскрытия списка в закрытом состоянии */
border-color: transparent transparent transparent gray;
border-style: solid;
border-width: .25em 0 .25em .5em;
margin: .35em .25em 0 0;
float: left;
width: 0px;
height: 0px;
line-height: 0px;
}
.marker.open {/* маркер раскрытия списка в открытом состоянии */
border-color: gray transparent transparent transparent;
border-width: .5em .25em 0 .25em;
}
/* IE 6 Fixup */
* html #multi-derevo * { height: 1%;}
* html .marker { border-style: dotted dotted dotted solid; }
* html .open { border-style: solid dotted dotted dotted; }
* This source code was highlighted with Source Code Highlighter.
Читайте: |
---|
Adobe представила второе поколение AirКомпания Adobe представила второе поколение кросс-платформенной технологии Air (Adobe integrated runtime), сообщается в блоге компании. Новая версия... |
PDF Metamorphosis .Net открывает разработчикам встраиваемые технологииНовый компонент PDF Metamorphosis .Net позволит разработчикам легко создавать приложения с возможностью конвертации документов различного формата в ... |
Легкий старт для разработчика. Все, что вы хотели знать о BizSparkЛюбой начинающий разработчик, будь-то частное лицо или молодая компания, нуждается в поддержке. Уже около двух лет существует такая программа поддер... |
Embedded InnoDB новый движок баз данныхOracle выпустила Embedded InnoDB. Совсем недавно «красный гигант» выпустили Embedded InnoDB, под довольно демократичной лицензией GPLv2, не Апатч... |
Microsoft сообщила об открытии исходного кода компиляторов Visual BasiВ то время как конкурирующие компании анонсируют новые, «более современные» языки программирования, корпорация Microsoft продолжает трудиться над ус... |
Оздана новая система беспроводной связи - она в 10Ученые из Национального тайваньского университета разработали новую систему беспроводной передачи данных, которая позволит передавать инф... |
Как взломали TwitterВ Интернетах, наряду с iPad, сканерами в аэропортах и войне между Google и Apple, уже второй день подряд активно обсуждается тема взлома и... |