Обучающие и познавательные статьи

Разметка рисунка (горячих областей) для создания ссылок

Определение координат тега < area >

Как получить координаты для тега area? Много информации перелопатил в интернете. Так и не нашел толкового ответа на этот вопрос. Источники в основном говорят о ручном создании координат.

Рис. 1
А если речь идет об автосоздании координат много говоря о лишнем, хором молчат о главном: "как именно?". Для тех, кто работает с визуальным редактором DreamWeaver (начиная с 4-й версии) нет никаких проблем при создании так называемых горячих областей. Спасибо сайту http://shkolasite.ru/html-css/kartyi-izobrazheniya.html где описывается эта процедура достаточно грамотно. Но здесь не описан нюанс создания многоугольной области. Поэтому решил осветить эту сторону проблемы. Вспомним, что тег area позволяет произвести разметку изображений (деление изображения на активные области, их также называют "горячие области"), таким образом, что каждая область является ссылкой. Области могут быть в форме многоугольника, прямоугольника или круга. Тег area используется обязательно внутри тега map, который называется картой-изображения". Для примера будем использовать изображение из рис.1.
↓Читать дальше На главнуюНа Главную
 

Синтаксис:
<map name="mapname">
<area параметры>
</map>

Параметры:

  • alt - Альтернативный текст для области изображения
  • coords - Координаты активной области
  • href - Задает адрес ссылки перехода, в т.ч. другого рисунка
  • nohref - Область без ссылки на другой документ
  • shape - Форма области (см. ниже)
  • target - Имя окна или фрейма, куда браузер будет загружать документ
  • title - Имя области, выдаваемое при наведении мыши
Собственно пара shape и coords определяет область:
для круга: <area shape="circle" coords="X,Y,R".../> - центр и радиус круга;
для прямоугольника: <area shape="rect" coords="X1,Y1,X2,Y2".../> - левый верхний и правый нижний углы;
для многоугольника: <a r e a shape="poly" coords="X1,Y1,..,Xn,Yn".../> - все вершины многоугольника выделяемой области.
Координаты задаются относительно левого верхнего угла картинки в пикселях (без указания приставки px) по часовой стрелке, охватывая все углы излома. Размечать рисунок следует в режиме "Разделенные окна"редактором DreamWeaver (Кто на англоязычной версии работает - Split). При щелчке на картине, выбранной для разметки, появляется окно "Свойства" рисунка (Properties).  Для создания прямоугольной и круглой области щелкаем по соответствующей фигуре на панели управления свойствами в нижней левой части окна редактора. Ставим курсор на левую верхнюю точку желаемой области (для круга приблизительно на 22 часа) подтверждаем кнопкой мыши (левой) и не отпуская ее, проводим курсор по картине до получения области желаемого размера. Когда отпускаем кнопку мыши, выбранная область закрашивается в полупрозрачный голубой цвет. В теге <img > нашего рисунка автоматически добавляется параметр с названием карты-описания областей (по умолчанию это "map", можно его изменить. Если мы создадим несколько карт, следующее имя по умолчанию будет "map2" и т.д.). Рядом с рисунком добавлен тег < map> с первой созданной областью внутри него в теге <area> с требуемыми координатами. В дальнейшем сюда добавятся все созданные нами области разметки в тегах <area>. Если область получилась немножко "не там", ее ставим на место: щелкаем один раз на левой кнопке мыши на требуемой области. Она выделяется дополнительно с маленькими квадратиками на вершинах области, ставим курсор внутри этой области нажимаем, левую кнопку мыши, не отпуская ее, ведем область на нужное место. Также можно растянуть/сжать созданную область, выделив ее, вышеописанным образом, курсор ставим на любую точку на ее вершинах, нажимаем одновременно клавишу CTRL

Рис. 2
и левую кнопку мыши, и проводим на новое место. Круглая область выделяется 4-я точками (не трудно догадаться "на сторонах света") и расширяется/сужается с помощью любой из них. Создание многоугольной области существенно отличается от описанных выше областей. Возможно, из-за этого многие авторы статей пропустили это описание. Для создания многоугольной области кликаем по требуемой фигурке на панели, затем ведем курсор на первую желаемую точку многоугольника, нажимаем клавишу CTRL не отпуская ее ставим левой кнопкой мыши первую точку области, затем перемещаемся на следующую и следующую точки (вершину, излома) многоугольника по часовой стрелке и ставим новые точки координат (каждая точка ставится коротким разовым щелчком мыши). За все время нажата только CTRL, ее отпускаем, когда все точки поставлены. Неверно созданную область можно удалить, выделив ее как описано выше, и нажав клавишу Del. Часто у новичков из-за раннего отпускания клавиши CTRL появляются многоугольники состоящие из 2-х точек. Их удалять можно только в коде: находим соответствующий тег <area shape="poly" coords="..."/> и удаляем данный тег. На рис. 2 уже размечены области. Работающий пример. Проверяйте наведением курсора. Отметим, что на рис. 2 "горячие области" выделены как их показывает Дримвивер. На сайте картина видна как на рис. 1. Из за простоты создания в примере нет прямоугольной области. Неправильный прямоугольник с названием "Дом" сделан как многоугольник тоже. Для наглядности вершины области "Автомобиль" пронумерованы. (Дрим не нумерует!) Также созданы области с названием "Солнце" и "Компьютер". Кстати возможность использования параметра title я в просмотренных интернет источниках не увидел.

Интересно отметить, что треугольная область выделяется параметром poly (многоугольник) и требует для описания 3 пары точек координат, тогда, как правильный прямоугольник требует всего 2 пары!
Важное примечание. Рисунки с параметром style="float" плохо поддаются редактированию координат в Дриме. Такие рисунки следует редактировать, сняв float (достаточно на 1 символ исказить параметр). После редактирование нужно восстановить значение параметра.

А тем, кто использует обычный редактор, то создавать координаты придется вручную. Но тут строить координаты тега area значительно облегчит использование графического редактора Фотошоп (Photoshop). Для начала создаем в Фотошопе копию изображения, которое хотим разбить на области. Это предосторожность нам позволит сохранить оригинал изображения, в случае ошибок при разметке, кроме того при выводе на сайт не оригинальных размеров изображения, это почти единственный способ для создания правильных координат. Итак, создаем копию изображения именно с такими размерами, какими оно будет выводиться на экран. Затем в Фотошопе сканируем нужные точки нужных областей с включенным режимом "Инфо" (Окно=>Инфо). В окне "Инфо" в нижней части кроме всего прочего указываются точные координаты наших областей (они обозначены через X и Y). Каждый раз, остановившись на нужной точке, вручную копируем и вставляем в соответствующую позицию тега <area> кода. Согласен, намного скучнее, чем в Дриме. Зато достоверно. Не надо линеек, штангенциркулей, "миллиметровки", не знаю, что еще может прийти в головы людей, которые не хотят, не могут или не умеют пользоваться почти волшебным визуальным редактором DreamWeaver! Для полноты информации отмечу, что разметку "горячих областей" позволяют выполнять и другие программы:
1) Map Edit
2) HTML Map Designer.
Но это не входит в тему данной статьи.

Вирус спрятал рабочую папку в мало используемую папку

Еще раз о вирусе Worm.Win32.Radminer.d

01.12.2012 Операционная система Windows XP-Professional + SP3

Почему я назвал этот вирус, который приходит к нам на компьютеры извне (обычно с флешек) и до сих пор все писали дружно о том, что он поражает (прячет) файлы только на флешке? Потому, что по поведению он больше подходит. Возможно это и сам вирус Worm.Win32.Radminer.d или разновидность его. Я думаю, классификацией его займутся специалисты. А суть такова:
Вирусу НЕТ!
В одно обычное рабочее утро я обнаружил пропажу своей основной рабочей папки. Какие чувства это вызывает понятно без описания. Я ее нашел внутри запылившейся папки, куда сам добровольно записать не мог.
Не нашел в интернете ничего, пришлось выкручиваться самому. Первым делом запустил системную проверку дисков, с параметрами «Автоматически исправлять системные ошибки» и «Проверять и исправлять поврежденные сектора». (Диск c:\ в последнюю очередь, поскольку эта проверка требует перезагрузку). Запустил антивирус на полную проверку. Процедура не из быстрых. Но стоит тратить на это, чтобы сберечь свои данные. Затем переместил папку на свое место. Удалил старую папку, поневоле ставшей мишенью. Внутри этой папки были такие файлы и такое содержимое, что никак не относилось к моим данным. Полностью был чужой и бессмысленный для меня контент. Внимание! Если папка или файлы имеют расширение *.exe уничтожить не открывая! Поискал в системном реестре слова целиком) совпадающие с названием зараженной папки. По удалял все новые файлы/папки с "0" длиной. Перезагрузился. Все нормально. На связанном компьютере пришлось идти на форматирование. Данные переписал с очищенного.
Почему не написал в лабораторию Касперского? Некогда. Они любят по полгода переписываться, все равно без очистки ничего не получается.

Делиться или нет, вот в чем вопрос

Real Master Не надо быть шаманом, чтобы понять, чем мастера сайтостроения делиться не любят. Конечно своими профессиональными секретами. Охотно рассказывая любому интересующемуся об азах любого вопроса, ни никогда не расскажут о тонкостях своего дела, которые приходят нередко в результате долгих кропотливых трудов, часто бессонных ночей и иных "неудобств". Да, конечно, есть вещи, которых нигде не найдешь, даже в большом интернете. Ведь океан открытий никогда не исчерпается, каждый творческий человек просто обязан делать открытия, хотя бы время от времени. Не важно большие, маленькие. Но свое, доселе неизведанное никому. Но, требовать от мастера вынь, да положь все, что знаешь, особенно трудно добытые и никому не известные знания - по крайней мере, бестактно. А что делать, вообще не спрашивать? Почему "нет", "у мастера спрашивай, сам не плошай" гласит интернет-пословица. В одном форуме участник написал, что часто ответ на вопрос находится, пока он обдумывает "кому позвонить или написать, и как спрашивать?". Первым делом приходится искать ответы на вопросы самому. Искать терпеливо и настойчиво. Эти качества обязательно получат свою награду. Научиться быстро отбрасывать ненужное, сортировать нужное по значимости. А мастеров можно понять. Отдай все свои секреты, а потом сиди голодным? Но, это вовсе не означает, что все мастера "жмоты". Этот парень, которого я разместил здесь, не такой. Он в группе талантливых вебсайтеров многие годы обучают людей бесплатно премудростям сайтостроения. На них можно выйти "через фото". Но, не забывайте, то любой труд достоин оплаты. Хороший труд - достойной оплаты.
Вы также можете обращаться к нам, чтобы получить

Интерактивные консультации по сайтам

. Вы всегда можете рассчитывать на посильную помощь и совет. За ответы в виде "да/нет" или "можно/нельзя" мы оплату не ждем.

Восстановление BlueTooth DUN модема

BlueTooth DUN modem Капризы операционнй системы Windows обще известны. Версия XP не исключение. В один BT DUN modemпрекрасный момент у меня в ноутбуке "исчез" BlueTooth DUN модем, который обеспечивает соединение компьютера к интернету через сотовый телефон. Формально причина была в том, что вместо вызова интернет соединения через упомянутый выше модем, в папке сетевые подключения включил BlueTooth PAN Network Adapter. Чисто механически, потому, что два значка стояли рядом. Но, это формальная причина. А истинная причина кроится в самой системе Windows - ребята в своих претензиях на мировое господство над "железом и программами" создали неуправляемый монстр. Но, это другая тема. Хоть сразу поняв ошибку, адаптер выключил. Но уже было поздно. При правильном нажатии на кнопку BlueTooth соединения, оно не устанавливалось. Появлялось сообщение об ошибке с кодом 633 (порт занят другим соединением и т.д.)
Совсем скоро обнаружилось, что испорчено не только соединение через BlueTooth, но и основное скоростное кабельное подключение. Это был запрещенный удар в рабочее время. Началось длительное скрупулезное разбирательство. Скоростное кабельное подключение я сравнительно быстро восстановил. Выяснилось, что параметры TCP/IP изменены (!) на не авто определение, а на конкретный IP, но с пустым значением! Оригинально, да? Неправильное нажатие BlueTooth-кнопки портит совершенно иную, не связанную функцию. Представьте себе аналогию, один честный гражданин заводил свою машину "машинально" неверно. Из-за этого у соседей, не исключено, что и Билла Гейтса, заглохли все машины. Что сделали ли бы с конструктором того такого авто, известно. А эти ребята живы, еще и не думают отказаться от своих амбиций.
Вкратце решение проблемы такое:
Пуск -> Панель управления -> Телефон и Модем -> Модем -> Добавить -> Мастер установки модема (поставить галочку Не определять тип модема (выбрать из списка) -> IV Corporation -> BlueTooth DUN modem -> Далее -> Ok
Если будут вопросы спрашивайте.
Вывод Joomla-модуля нестандартно по-клику
Вывод модулей в Joomla
Рис.3. Для увеличение наведите мышку.
Модуль является прекрасным средством управления контентом CMS Joomla. Он тем хорош, что можно выводить в любую позицию шаблона со всеми элементами меню или с выбранными. Позиции для вывода указываются в "админке" (рис.3) В интернете полно материала на данную тему. А когда мне понадобилось вывести модуль не сразу когда активизируется меню, а по дополнительному клику, я не нашел ни одного материала. Поэтому, думаю, статья сможет кому-то принести пользу. Уточню, что данную проблему решал для версии 1.5. Вывод модуля JoomlaА описанный ниже способ является универсальным и потому подойдет для всех версий.
И так, у нас есть контент (материал, раздел, категория) назовем его article. Он выводится вместе с пунктом меню menu1 (по клику). Внутри нашего материала речь идет о неком предмете (товар, услуга, источник и т.д.), который расположен в модуле под названием modview. Если мы modview привяжем к меню menu1, то модуль выведется вместе с материалом article. В данном случае, мы так не хотим. Такая необходимость возникает часто при организации показа слайдов (галереи), при выводе списка (оглавления, перечня...) литературы и т.д., которые собраны в определенном модуля (в нашем примере modview). Модуль должен выводиться при необходимости: в материале красиво оформлена ссылка на данный предмет (например, что-то в этом роде "Посмотреть перечень (список, слайд, видео) можно здесь.)(Закрыть) Я думаю, Вы меня поняли. Мой читатель, которого заинтересовала статья точно знает, что ему нужно. Только не нашел способа, как это реализовать, как свое время искал я сам.
Суть предложенного метода в том, что контенту, в котором мы хотим создать ссылку (article) нужно назначить два пункта меню. Да, именно так. Первый пункт меню menu1 выполняет основную функцию, выводит все как задумано. А дополнительный пункт, назовем его menu2, создается для вывода нашего модуля modview, но показывает на контент article. А модуль modview уже привязываем к новому пункту меню menu2 и только к нему (теоретически можно и к другим пунктам меню, кроме menu1). Это главный момент идеи. Если это понятно, то все получится. Внутри контента имеется ссылка на пункт меню menu2, который в свою очередь перезагружает article. Но уже с другим пунктом меню, к которому привязан модуль. Вот и все. Очень просто. Конечно, можно было искать еще какой-нибудь метод, используя Ajax-технологии, чтобы не перезагружать страницу. Но, это было бы гораздо сложнее. Для нашего развлекательно-познавательного случая описанный выше метод вполне подходит.
Fatal error: Call to a member function get() on a non-object in ...\plugins\content\pagebreak.php on line 70
Данная ошибка появляется в Joomla версии 1.5 при наличии тега разделителя страницы (<hr />) в контенте категории. Удивительно, что тег вызывает ошибку, даже в случае, если он закомментирован, например, в таком виде: <!-- hr class="system-pagebreak" title="2" alt="2" / -->
Хотя в общем комментарии идут. Можно комментировать любой другой тег. Поэтому при появлении данной ошибки первым делом проверьте наличие в категории тега (<hr />) и удалите его физически. =)



Понравившийся дизайн ()