Pull to refresh
1
0

User

Send message

12 малоизвестных фактов о CSS

Reading time9 min
Views60K
Предлагаю читателям «Хабрахабра» перевод статьи «12 Little-Known CSS Facts (The Sequel)». Она совсем недавно была упомянута в дайджесте интересных материалов из мира веб-разработки и IT.

Update: немного «шлифанул» перевод напильником. Выражаю благодарность всем неравнодушным читателям.
Внимание! Под катом почти 1.5 Мб картинок и много интересных ссылок.

Итак, начнём-с…

1. В свойстве border-radius можно использовать slash-синтаксис.


Об этом уже писалось 4 года назад, но многие новички и даже некоторые опытные разработчики не знают о существовании этой «фишки».

Верите или нет, но следующий код валиден:

.box {
  border-radius: 35px 25px 30px 20px / 35px 25px 15px 30px;
}

Читать дальше →
Total votes 73: ↑71 and ↓2+69
Comments21

В Adobe Flash Player и Oracle Java обнаружены опасные 0day уязвимости

Reading time1 min
Views16K
В Adobe Flash Player обнаружена третья за последние две недели критическая 0day уязвимость, которая позволяет атакующим удаленно исполнять код через браузер. Эксплойт также присутствовал в архиве с утекшими данными Hacking Team. Уязвимость получила идентификатор CVE-2015-5123 и была позднее включена в уведомление безопасности APSA15-04, который мы уже упоминали ранее. Антивирусные продукты ESET обнаруживают эксплойт для этой уязвимости как SWF/Exploit.Agent.IR.



В свою очередь, компания TrendMicro заявила об обнаружении 0day RCE эксплойта для известного ПО Oracle Java, которое уже неоднократно попадало под объективы злоумышленников. Эксплойт был использован в направленных атаках в рамках известной кибератаки Pawn Storm. В этой операции злоумышленники использовали и вредоносное ПО для мобильных платформ, в т. ч. iOS. Антивирусные продукты ESET обнаруживают полезную нагрузку этого эксплойта как Win32/Agent.XIJ.

Читать дальше →
Total votes 17: ↑13 and ↓4+9
Comments15

Взлом сайта и его последствия

Reading time8 min
Views158K


Времена, когда сайты взламывались ради забавы почти прошли. В современных реалиях сайты атакуют для извлечения прибыли. Атаковать могут абсолютно любой сайт, даже с минимальными показателями и трафиком.
Читать дальше →
Total votes 37: ↑33 and ↓4+29
Comments30

Как внедрить баннеры в Android приложение не перекрыв другие элементы

Reading time6 min
Views17K
Баннеры – один из наиболее популярных видов рекламы в мобильных приложениях. Они не занимают много места, как, например, полноэкранная (interstitial) реклама. И позволяют совместить их с элементами пользовательского интерфейса приложения. Их можно добавить на разные экраны в приложении.

Прочитав данную статью, вы узнаете, как лучше вставить баннеры таким образом, чтобы они не мешали пользователю и не портили вид приложения. При этом вам не придётся изменять layout xml и вносить много изменений в код приложения. Вы можете внедрить баннеры в своё готовое приложение, добавив всего несколько строк кода. Подход, описанный в статье, универсальный, вы можете использовать его для API любых рекламных сервисов. Статья будет интересна как для новичков, так и для опытных разработчиков. Если вы — новичок в разработке, то для того, чтобы понять предмет статьи, от вас не потребуется каких-либо глубоких знаний. Достаточно понимания базовых концепций разработки под Android. А опытные разработчики могут найти в ней готовое решение, которое они могут внедрить у себя. Но инициализация рекламного сервиса, работа с конкретными рекламными API и кеширование находятся за пределами данной статьи. Для решения таких вопросов, пожалуйста, обратитесь к руководству для вашего конкретного рекламного сервиса.
Читать дальше →
Total votes 11: ↑10 and ↓1+9
Comments6

Мультизагрузка в wysiwyg редакторе

Reading time3 min
Views11K


Суть вот в чем, есть редактор (для примера: imperavi.com/redactor) и есть необходимость загружать сразу много картинок за один раз. В идеале простым перетаскиванием, а в нашем случае редактор кушает только одну картинку за раз. Это нужно поправить.

Покопавшись в api редактора и не найдя ничего про мультизагрузку, я начал думать, как решить эту проблему, не прибегая к каким-то глобальным разработкам вроде написания плагина с нуля. Это займет много времени и усилий, к тому же время поджимало и сделать нужно до вечера.
Читать дальше →
Total votes 19: ↑17 and ↓2+15
Comments2

Webix. Первое знакомство с JavaScript фреймворком

Reading time11 min
Views55K


Эта статья предназначена для тех, кто хочет узнать об основах использования этого фреймворка. В ней я постараюсь подробно рассказать о том, как начать работу с Webix. Также стоит обратить внимание на то, какие дополнительные полезные инструменты, помимо библиотеки, предлагают разработчики.

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

Исходный код можно писать по мере прочтения статьи, а можно сразу скачать с гитхаба и разбираться с ним в процессе.

Читать дальше →
Total votes 32: ↑31 and ↓1+30
Comments24

CTB-Locker. Мы решили платить

Reading time3 min
Views93K


CTB Locker — очень хорошо продуманный и опасный вирус. Писать о нем не буду — информации об этом вирусе в интернете очень много.

За последние 3 месяца некоторые наши клиенты поймали этого зверя, несмотря на предупреждения, обновленные корпоративные антивирусы и прочие решения защиты. У некоторых страдала отдельная рабочая машина, у других — сервер терминалов. Но средства резервного копирования всех спасали.

Последнее заражение одного из клиентов привело к потере большого количества данных, а также некоторых резервных копий. Ответственность за это лежала на клиенте — финансирование на расширение сервера резервного копирования не могли выделить пол года. Но суть не в этом. Нам поставили задачу платить создателям вируса (и тут финансирование резко нашлось).

Я не агитирую пользователей сообщества платить злоумышленникам (я противник этого), но, возможно, этот небольшой мануал кому-то поможет.

Далее я опишу пошагово, как платил плохим людям за расшифровку клиентских данных.
Читать дальше →
Total votes 98: ↑69 and ↓29+40
Comments246

Философия эволюции и эволюция интернета

Reading time17 min
Views16K
СПб, 2012
Текст не о философии в интернете и не о философии интернета – философия и интернет в нем строго разведены: первая часть текста посвящена философии, вторая – интернету. В качестве связующей оси между двумя частями выступает понятие «эволюция»: разговор пойдет о философии эволюции и об эволюции интернета. Сначала будет продемонстрировано, как философия – философия глобального эволюционизма, вооруженная концептом «сингулярность» – неизбежно подводит нас к мысли, что именно интернет является прообразом будущей постсоциумной эволюционной системы; а потом и сам интернет, вернее логика его развития, подтвердит право философии рассуждать на, казалось бы, сугубо технологические темы.
Читать дальше →
Total votes 13: ↑10 and ↓3+7
Comments28

Делаем веб-формы удобнее для заполнения

Reading time5 min
Views27K
Привет, Хабр! Сегодня для работы в Интернете все чаще используются мобильные устройства, а не компьютеры. При этом, на многих сайтах есть формы для ввода данных, позволяющие совершить покупку или подписаться на рассылку. Как результат, пользователям приходится много раз вводить на разных сайтах такие сведения о себе, как имя, номер телефона и адрес. Удобство веб-форм имеет огромное значение, потому что при работе с ними всегда вероятны ошибки, в результате чего многие пользователи вовсе отказываются от заполнения. Три года назад мы представили функцию автозаполнения в браузере Chrome, которая упрощает ввод данных в формы. Теперь Chrome полностью поддерживает в формах атрибут autocomplete в соответствии с современным стандартом WHATWG HTML. Благодаря этому веб-мастера и разработчики могут помечать поля атрибутами, например name и street-address (имя и адрес), не изменяя интерфейс или другой код сайта. Те, кто реализовал эти возможности, отмечают, что их формы стали заполняться чаще.

автозаполнение форм на смартфоне

Например, если пометить поле для ввода электронного адреса, то код будет выглядеть так:

<input type="text" name="customerEmail" autocomplete="email"/>

Больше кода под катом!
Total votes 27: ↑24 and ↓3+21
Comments11

Список сочетания клавиш для восстановления заводских установок ноутбуков

Reading time1 min
Views512K
Многие владельцы ноутбуков знают, что если их мобильный помощник приобретался с предустановленной ОС, то в 90% случаев на жестком диске есть специальный раздел, предназначенный для хранения образа операционной системы с драйверами и программами. Кто-то удаляет этот раздел сразу, дабы высвободить место, а кто-то даже и не знает о его существовании. А некоторые используют его по назначению. Войти в меню восстановления можно в среде Windows, но если система слетела то, как быть? Восстановить систему при помощи горячих клавиш. Вот мой небольшой списочек этих горячих клавиш.

После включения ноутбука начинаем лихорадочно нажимать:


F3 – MSI;
F4 – Samsung. Под ОС можно через Samsung Recovery Solution III;
Читать дальше →
Total votes 58: ↑48 and ↓10+38
Comments40

Почему 98% текстов на ваших сайтах не работают. Вообще. И как это починить

Reading time7 min
Views284K

Вот так люди видят вашу страницу

Привет!
Проблема вот в чём. Если зайти на практически любой сайт интернет-магазина или компании с услугами, вы встретите контент. Точнее — отвратительные тексты, которые писали, кажется, маркетологи, воспитанные сеошниками.

Разумеется, можно не делать, как они. Если работать по-умному, то вы поможете и читателям по жизни, и себе в продажах.

По моим примерным подсчётам (усреднение с ряда позиций), конверсии для нас выглядят так:
  • Только название и картинка — около 1,5%.
  • С описанием от производителя — чуть более 2%.
  • С описанием человека, который держал это в руках и знает правила — около 6%.

Ниже — рассказ про то, как мы доводили время на сайте от 3 минут сначала до 6:40, а потом до 20:48. Да-да, двадцати минут сорока восьми секунд для среднего посетителя. Честного среднего, с учётом отказов и по полной выборке.
Читать дальше →
Total votes 294: ↑282 and ↓12+270
Comments121

Скачивать музыку и видео с ВК средствами браузера Chrome, используя свое расширение

Reading time9 min
Views22K
Добрый день, уважаемые Хабражители. Сегодня хочу поделиться с Вами кодами на Javascript для возможности перекачивания музыки и видео с ВК своими ручками на свой персональный компьютер. Ведь нетрудно себе представить, как записал клевый клип и музыку, потом закачал их туда, но на твоем компьютере все это добро куда то пропало… Что ж, не беда! Мы выкачаем то, что мы закачали туда обратно. Главное, что нам это наш браузер, да сайт позволяют, осталось пораскинуть мозгами.

Для начала нам надо распарсить аудиофайлы… Итак, возьмемся за класс «area clear_fix» и будем пихать в массив то, что принадлежит к классу «play_new». Сначала присвоим в массиве стили, чтобы отловить положение элементов на странице (в последующем для отображения кнопочек рядышком). Потом получим ссылки из input и имя будущего файла из тега b. Потом нужно будет присваивать новым ссылочкам, которые мы будем создавать атрибут download.

function audio(){
var main_div=document.getElementsByClassName("area clear_fix");
for(var i=0;i<main_div.length;i++){
if(main_div[i].parentNode.firstChild.href){
main_div[i].parentNode.firstChild.style.top=main_div[i].getElementsByClassName('play_new')[0].offsetTop+"px";
continue;
}
var _mp3_=main_div[i].getElementsByTagName("input")[0].value.split(",")[0];
var _b_=main_div[i].getElementsByTagName("b")[0];
var _top_=document.getElementById(main_div[0].parentNode.id.replace('audio','play')).offsetTop+"px";
var _t_=main_div[i].getElementsByClassName('play_new')[0].offsetTop+"px";
 var span=main_div[i].getElementsByTagName('span')[0];
 var ispan=span.innerHTML;
  if(span.children[0]){
   var ispan=span.children[0].innerHTML;
  }
var _a_=document.createElement("a");
//_a_.href=""+_mp3_+"&name="+_b_.children[0].innerHTML+"-"+ispan;
_a_.href = _mp3_.substring(0, _mp3_.indexOf('.mp3') + 4);
_a_.download=trim(_b_.children[0].innerHTML+"-"+ispan)+".mp3";
_a_.title='Скачать '+_b_.children[0].innerHTML+"-"+ispan;
_a_.draggable="true";
_a_.innerHTML='<span style="cursor:copy;padding:6px;width:16px;height:16px;background-color:#5F7D9D;color:#fff;border-radius:2px;"><img src="http://st0.vk.me/images/icons/darr.gif" /></span>';
_a_.style.zIndex="10";
_a_.style.left="30px";
_a_.style.top=_t_;
_a_.style.position="absolute";
main_div[i].parentNode.insertBefore(_a_,main_div[i].parentNode.firstChild);
_b_.style.paddingLeft="27px";
}
}


Тут как бы понятно должно быть, все… ну а чтобы отрезать всякий мусор после расширения файла мы применили:
_a_.href = _mp3_.substring(0, _mp3_.indexOf('.mp3') + 4);

В общем уже можно это запустить таким образом через интервал, конечно же если мы находимся на том самом сайте:

setInterval(function(){
  if(window.location.href.indexOf('vk.com')>1) {
 if(document.getElementsByClassName("area clear_fix").length!=0){
  audio();
  }   }  },1000);


Хорошо. Одна функция готова. Пора поведать и о том как скачать видеофайлы…

Читать дальше →
Total votes 30: ↑13 and ↓17-4
Comments9

CleverStyle CMS — обзор для разработчика

Reading time5 min
Views7.1K
ВНИМАНИЕ: Статья актуальна на время написания, текущее положение вещей может отличаться чуть менее чем полностью.

Почему ещё одна CMS?


На самом деле скорее CMF, а название сложилось исторически. Смысл CMS/CMF в том, чтобы сделать разработку сайта проще, быстрее и дешевле. Но в реальной жизни можно столкнуться с тем, что отклонение от стандартного поведения в CMS вынуждает лезть в исходники ядра, что чревато последующими проблемами с обновлением и безопасностью, а в CMF можно столкнуться с высоким порогом входа и достаточно большим весом системы.

Моей целью было сделать баланс функциональности, сложности и удобства как можно более гармоничным.
Система имеет определённое количество велосипедов, немного магии, и большие планы.
На данный момент CleverStyle CMS может быть интересной игрушкой именно для разработчиков, так как позволяет быстро начать разработку и получать результаты, предоставляет сложным и/или рутинным задачам простой интерфейс, потому и статья об некоторых технических особенностях с примерами в общем.
Что к чему - под катом
Total votes 33: ↑10 and ↓23-13
Comments42

Как на самом деле работает mod_rewrite. Пособие для продолжающих

Reading time17 min
Views277K
image
Эта статья выросла из идеи продвинутого обучения наших сотрудников технической поддержки работе с mod_rewrite. Практика показала, что после изучения имеющихся в большом количестве учебников на русском языке саппортам хорошо дается решение шаблонных задач, но вот самостоятельное составление правил происходит методом проб и большого количества ошибок. Проблема заключается в том, что для хорошего понимания работы mod_rewrite требуется изучение оригинальной англоязычной документации, после чего — либо дополнительные разъяснения, либо часы экспериментов с RewriteLog.

В статье изложен механизм работы mod_rewrite. Понимание принципов его работы позволяет четко осознавать действие каждой директивы и ясно представлять себе, что происходит в тот или иной момент внутри mod_rewrite при обработке директив.

Я предполагаю, что читатель уже знаком с тем, что такое mod_rewrite, и не буду описывать его основы, которые легко найти в интернете. Также нужно отметить, что в статье освещается работа mod_rewrite при использовании его директив в файле .htaccess. Отличия при работе в контексте <VirtualHost> изложены в конце статьи.

Итак, вы изучили mod_rewrite, составили несколько RewriteRule и успели столкнуться с бесконечными перенаправлениями, со случаем, когда правило почему-то не ловит ваш запрос, а также с непредсказуемой работой группы правил, когда последующее правило неожиданно изменяет запрос, кропотливо подготовленный правилами предыдущими.

Почему так происходит?
Читать дальше →
Total votes 208: ↑203 and ↓5+198
Comments25

Скрипт мониторинга процессов MySQL на Perl

Reading time6 min
Views6.8K
Всем привет.

Более пяти лет я работаю системным администратором в хостинговой компании, обслуживаю более сотни серверов с freebsd и centos. За это время накопилось много самописных скриптов, облегчающих мне жизнь. Этими скриптами хочу поделиться с сообществом, да и выслушать здоровую критику никогда не помешает.

Предыстория.
Читать дальше →
Total votes 11: ↑7 and ↓4+3
Comments10

«Див» блоки одинаковой высоты

Reading time2 min
Views44K

На днях столкнулся с задачей:


Сделать две одинаковые по высоте -колонки, не зависимо от количества текста в какой либо из них.

Условия:


  1. Никаких таблиц;
  2. Поддержка IE6+ и т.д;
  3. Резиновая верстка;
  4. Никакого JavaScript, чистый HTML и CSS.

Дизайн:


В дизайне изображены две колонки с отступом друг от друга. Каждый из них имеет свой фон и border с округленными уголками. На вид все просто.

Поиск решений:


Искал и естественно нашел очень полезный пост, где описаны все самые действенные способы решения данной задачи: http://habrahabr.ru/post/64173/.
Собственно 4-е решение из этого поста было наиболее приемлемым, но с помощью него мне так и не удалось вывести два разных фона для своих колонок.

Решение

Читать дальше →
Total votes 44: ↑32 and ↓12+20
Comments95

Javascript: ООП, прототипы, замыкания, «класс» Timer.js

Reading time19 min
Views97K
Здравствуйте программисты начинающие, законченные, а также все сочувствующие. Как известно, ничто не познается так хорошо, как на собственном опыте. Главное, чтобы опыт был полезный. И в продолжении этой простой мысли я хочу предложить заняться несколькими полезными делами сразу:
  • Побеседовать на тему «ООП с человеческим лицом».
  • Разобраться с прототипами в javascript, коротко и сердито!
  • Вспомнить, что «замыкание» это не только ценный мех… удар током.
  • Написать на javascript класс Timer — этакий планировщик событий для запуска анимаций, событий, любых функций.
  • Весело провести время!

Предупреждение! Если вы не ждете от статьи ничего веселого… то ошибаетесь. Людям с пониженным чувством юмора читать… еще более рекомендуется! Ну-с, приступим…
Читать дальше →
Total votes 101: ↑87 and ↓14+73
Comments51
12 ...
12

Information

Rating
Does not participate
Location
Россия
Date of birth
Registered
Activity