font-weight числа, названия и значения

font-weight принимает значения

normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900

Вместо использования чисел для большинства стандартных шрифтов можно использовать буквенное обозначение

font-weight: normal; // 400
font-weight: bold; // 700

Когда дело доходит до макетов

font-weight: 100; // Thin (Hairline)
font-weight: 200; // Extra Light (Ultra Light)
font-weight: 300; // Light
font-weight: 400; // Normal
font-weight: 500; // Medium
font-weight: 600; // Semi Bold (Demi Bold)
font-weight: 700; // Bold
font-weight: 800; // Extra Bold (Ultra Bold)
font-weight: 900; // Black (Heavy)

Еще шрифты умеют фалбечиться

Если шрифта жирнотой от 500 нет, он ищет все что жирнее, и если не находит берет самый ближайший тонкий шрифт
Если шрифта жирнотой от 400 нет, он ищет все что тоньше и если не находит берет самый ближайший толстый шрифт

Относительные значения bolder и lighter

Относительные значения работают только по четырем параметрам: 100 - 400 - 700 - 900

bolder поднимает жирноту наследуемого значения до следующего из 4
lighter опускает жирноту наследуемого значения до предыдущего из 4

если наследуемое значение крайнее (100, 900) — то ничего не происходит.

скриншоты в osX на маке

  1. весь экран в файл на рабочий стол ⌘ + ⇧ + 3
  2. весь экран в буфер обмена ⌘ + ⇧ + ⌃ + 3
  3. область экрана в файл на рабочий стол ⌘ + ⇧ + 4 — выделить нужную область мышкой
  4. область экрана в буфер обмена ⌘ + ⇧ + ⌃ + 4 — выделить нужную область мышкой

Если нужен скриншот окна целиком — вместо выделения — нажать пробел потом кликнуть мышкой

⇧ - Shift
⌃ - Control
⌥ - Option aka alt
⌘ - Command

Источник:  support.apple.com

jquery serializeObject()

в jQuery есть методы .serialize() и .serializeArray(), добавим возможность сериализации в объект

$.fn.serializeObject = function()
{
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};
$( "form" ).submit(function( event ) {
  console.log( $( this ).serialize() );
  console.log( $( this ).serializeArray() );
  console.log( $( this ).serializeObject() );
  event.preventDefault();
});

Переместить файл osX

На маке, в osX всё таки можно перемещать файлы, правда делается это не так как на винде.

  1. Помещение файла в буфер обмена всегда одинаково — ⌘ + c
  2. Вставка копии, соответственно ⌘ + v
  3. Перемещение оригинала ⌘ + ⌥ + v

Если вы хотите переместить файл через контекстное меню (правую кнопку мыши) надо так же зажать и пункт в списке сменится на «переместить»

 

⇧ - Shift
⌃ - Control
⌥ - Option aka alt
⌘ - Command

Удаляем все записи в vk.com и twitter.com

Всё очень просто.

В Вк надо нажать на крестик справа от поста. Если постов больше 10 штук, то вручную это делать — долго.
На помощь приходит javascript и консоль в инструментах разработчика.

Собираем все ссылки «удалить» и кликаем по ним с помощью javascript

Откройте инструменты разработчика (f12) и скопируйте в консоль вот это.

var myarr = document.getElementsByClassName('post_delete_button fl_r')
for (var i = 0; i < myarr.length; i++) {
    myarr[i].click();
}

В твиттер надо нажать на кнопку «удалить», а потом «подтвердить».

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

Откройте инструменты разработчика (f12) и скопируйте в консоль вот это.

setInterval(function(){
	document.querySelector(".js-actionDelete button").click();
	setTimeout(function(){
		document.querySelector(".modal-footer .delete-action").click();
	},300);
},1500);

Требования рекомендации к дизайн-макетам psd, для облегчения жизни front-end разработчика

Источники:

  1. http://photoshopetiquette.com/
  2. http://www.masiev.com/articles/prodvizhenie­i­raskrutka­sajtov/trebovanija­k­psd­maketu
  3. http://habrahabr.ru/post/197588/
  4. http://habrahabr.ru/post/173271/
  5. https://github.com/derbyjs-group-ru/talk/wiki/Требования-к-PSD-макетам-для-отзывчивого-дизайна
  6. http://palpalych.ru/blog/7­prochee/85­trebovanija­k­dizajnmaketu­sajta.html

Читать далее «Требования рекомендации к дизайн-макетам psd, для облегчения жизни front-end разработчика»

Скрипт popup окна

Старенький скрипт открытия модальных окон.
умеет открываться по ссылке, открываться по событию. закрываться крестиком, кликом по фону, и по кнопке esc.

JS Bin on jsbin.com

hello word

Пришло время сделать сайт. Попробуем его сделать из вордпресса.