OpenStreetBugs — лёгкий способ сообщить об ошибке в OpenStreetMap

OpenStreetBugs — лёгкий способ сообщить об ошибке в OpenStreetMap

Вы, конечно, знаете о свободной карте OpenStreetMap. Это настоящая народная карта, создаваемая такими же людьми как и вы! Это такой же opensource-проект как Linux и как Википедия. Конечно же, как и в других картах, в OpenStreetMap имеются ошибки, но в отличие от тех же Яндекс.Карт, где ошибки не исправляются годами из-за сложной бюрократической процедуры (я уже не говорю о намеренных ошибках), в OpenStreetMap всё гораздо проще и лучше для всех нас...
Подробнее..

CloudMade Navigation поддерживает ограничения манёвров

CloudMade Navigation поддерживает ограничения манёвров

Не так давно CloudMade выделил несколько приоритетных направлений, среди которых оказалась и навигация. Решено было создать специальный проект Navi Studio, который объединял бы в себе несколько более мелких сервисов и позволял пользоваться ими, для создания полноценного навигационного программного обеспечения. В Navi Studio вошли: Работа закипела и уже появилось несколько приложений использующих данный проект. Но полноценной навигации без соблюдения правил ПДД не существует, а потому данному вопросу было также уделено не мало времени...
Подробнее..

Удали себя из интернет-социума — «Web 2.0 Suicide Machine»

Удали себя из интернет-социума — «Web 2.0 Suicide Machine»

Недавно наткнулся в сети на один занимательный интернет-сервис, именующийся Web 2.0 Suicide machine . Предназначен он для того, чтобы позволить людям, обремененным «социальной жизнью в интернете», в пару кликов удалить свои аккаунты на Facebook (в данный момент сервис блокирован администрацией по IP), Twitter, Linkedin и Myspace. В общем-то судя по количеству положительных отзывов и «успешных очищений» — пипл хавает зависимые от социальных сетей успешно пользуются сервисом и довольны...
Подробнее..




Запись гитарных аккордов HTML+CSS (теперь с баррэ)

Веб разработка - CSS

запись гитарных аккордов html+css (теперь с баррэ)


Увлекло меня это дело — описание гитарных аккордов, по научному — аппликатура. Начало было положено в предыдущим топике про запись аккордов и теперь получило своё развитие.
Я учел пожелания и сделал новую версию.
Теперь метка прижимаемой струны — это точка • (& bull;) вместо © (& copy;).
В прошлой версии не было поддержки отображения баррэ — теперь есть и большое, и малое баррэ.
Добавлена поддержка Google Chrome.

В данной версии номера пальцев прижимающих струну по-прежнему отображаются рядом с меткой. Вариант с использованием шрифта позволяющего отображать метки с цифрой внутри возможно будет, но сейчас могу предложить только такой вариант.

Баррэ


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

Как это выглядит в Html


Привожу часть кода, аккорд с малым баррэ.

<div id= Dm class= accord float-l >            <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span>0</span></li>                                      <li><span>X</span></li>                                      <li><span>X</span></li>                               </ul>            <div class= grif >               <div class= porojek verx ></div>               <ul>                                       <li><span>•</span><small>1</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>2</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                       <li><span>•</span><small>3</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <div class= clearfix ></div>            </div>            <div class= accord-name >Dm</div>                       </div><!-- /accord Dm -->         <div id= Am class= accord float-l >            <ul>                                      <li><span>0</span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span>0</span></li>                                      <li><span>X</span></li>                               </ul>            <div class= grif >               <div class= porojek verx ></div>               <ul>                                      <li><span> </span></li>                                       <li><span>•</span><small>1</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>3</small></li>                                       <li><span>•</span><small>2</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <div class= clearfix ></div>            </div>            <div class= accord-name >Am</div>                       </div><!-- /accord Am -->                  <div id= F class= accord float-l >            <p>Большое баррэ</p>            <div class= nomer-lada ><ol type= I start= 1 ><li> </li></ol></div>            <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>            <div class= grif >               <div class= porojek verx ></div>               <div class= barre ></div>               <ul>                                       <li><span>•</span><small>1</small></li>                                       <li><span>•</span><small>1</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>1</small></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>2</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>4</small></li>                                       <li><span>•</span><small>3</small></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <div class= clearfix ></div>            </div>             <div class= accord-name >F</div>                       </div><!-- /accord F -->                  <div id= Db class= accord float-l w4 >            <p>Малое баррэ</p>            <div class= nomer-lada ><ol type= I start= 1 ><li> </li></ol></div>            <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span>X</span></li>                               </ul>            <div class= grif >               <div class= porojek verx ></div>               <div class= barre na3 ></div>               <ul>                                       <li><span>•</span><small>1</small></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>1</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                       <li><span>•</span><small>2</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>3</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>4</small></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <div class= clearfix ></div>            </div>             <div class= accord-name >I-C# или Db</div>                       </div><!-- /accord Db -->                  <div id= H class= accord float-l >            <div class= nomer-lada ><ol type= I start= 2 ><li> </li></ol></div>            <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span>X</span></li>                               </ul>            <div class= grif >               <div class= porojek ></div>               <div class= barre ></div>               <ul>                                       <li><span>•</span><small>1</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>1</small></li>                                       <li><span>•</span><small>1</small></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                       <li><span>•</span><small>4</small></li>                                       <li><span>•</span><small>3</small></li>                                       <li><span>•</span><small>2</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <div class= clearfix ></div>            </div>             <div class= accord-name >H</div>                       </div><!-- /accord H -->                  <div id= Hm class= accord float-l >            <div class= nomer-lada ><ol type= I start= 2 ><li> </li></ol></div>            <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span>X</span></li>                               </ul>            <div class= grif >               <div class= porojek ></div>               <div class= barre na5 ></div>               <ul>                                       <li><span>•</span><small>1</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>1</small></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                       <li><span>•</span><small>2</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <ul>                                      <li><span> </span></li>                                      <li><span> </span></li>                                       <li><span>•</span><small>4</small></li>                                       <li><span>•</span><small>3</small></li>                                      <li><span> </span></li>                                      <li><span> </span></li>                               </ul>               <div class= porojek ></div>               <div class= clearfix ></div>            </div>             <div class= accord-name >Hm</div>                       </div><!-- /accord Hm -->         <div class= clearfix ></div>         <dl>            <dt>Обозначения</dt>            <dd class= bull ><b>•</b><sup>1</sup><span>             — место прижатия струны и номер пальца</span></dd>            <dd><small>0</small><span> — звучит неприжатая струна</span></dd>            <dd><small>X</small><span> — струна не звучит</span></dd>            <dd><span><strong>I.</strong></span>            — номер лада на котором зажимается баррэ</span></dd>            <dd><span><strong>[</strong></span>            — обозначение баррэ (зажимается 1 пальцем)</span></dd>         </dl>          <p class= float-r mar1-b ><a href= http://r3code.habrahabr.ru/blog/53792/ >r3code.habrahabr.ru</a></p>      </div><!-- /content -->

 


Читайте:


Добавить комментарий


Защитный код
Обновить

News image

Adobe дает новые возможности для разработчиков смартфонов

Adobe Systems представила на выставке Mobile World Congress в Барселоне проекты, которые сделают технологии Adobe еще более доступными для мобильных...

News image

Microsoft для российских разработчиков: практика с элементами фундамен

26 марта 2010 года в Центре международной торговли на Краснопресненской набережной Москвы компания Microsoft впервые в России провела конференцию дл...

News image

Google I/O: новый Android, Google TV и машинное обучение

Несмотря на то, что первый день конференции I/O, проводимой компанией Google для разработчиков, принёс много интересных анонсов, во второй, заключит...

News image

Инструменты оценки состояния проектов по разработке

Программирование – процесс творческий, и очень часто попытки измерить какие либо параметры проекта рассматриваются как нечто крамольное. Действитель...

News image

Embedded InnoDB новый движок баз данных

Oracle выпустила Embedded InnoDB. Совсем недавно «красный гигант» выпустили Embedded InnoDB, под довольно демократичной лицензией GPLv2, не Апатч...

Топ технологий:

News image

Оздана новая система беспроводной связи - она в 10

Ученые из Национального тайваньского университета разработали новую систему беспроводной передачи данных, которая позволит передавать инф...

News image

Как взломали Twitter

В Интернетах, наряду с iPad, сканерами в аэропортах и войне между Google и Apple, уже второй день подряд активно обсуждается тема взлома и...