Sensei

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

http://caniuse.com/#feat=datauri

http://jsfiddle.net/57UWE/

Благодарю за пример. Обязательно разберу его и подправлю свой код.

Стало интересно, решил свой велосипед сделать http://jsfiddle.net/Q8gAY/3/ Возможно не самая оптимальная реализация, мне такие понятия как «линейная интерполяция» неизвестны =) Но может кому и пригодится.

Чем «display: table» не угодил? Вот вам «без костылей» http://jsfiddle.net/X2fsg/2/

Судя по градиенту из вашего примера, сам паттерн размером 3х3 пикселя, так почему картинка весит так много?

Складывается впечатление, что некоторым людям свойственно думать, будто форум — это их личная техподдержка. Иначе как объяснить подобный тон...

Можно перевести картинку в base64, и полученный код вставить фоном с помощью data URIs

http://jsfiddle.net/X2fsg/

Все оттого, что элементов на момент обращения к ним в скрипте еще не существует. Либо вставляйте скрипт перед закрывающим тегом body, либо выполняйте код по событию load у документа.

http://jsfiddle.net/uvCh6/ тоже самое на jQuery http://jsfiddle.net/uvCh6/1/

Например @font-face { font-family: 'Dosis'; src: url('../font/Dosis/Dosis-regular.woff'); font-weight: 400; font-style: normal;}@font-face { font-family: 'Dosis'; src: url('../font/Dosis/Dosis-italic.woff'); font-weight: 400; font-style: italic;}@font-face { font-family: 'Dosis'; src: url('../font/Dosis/Dosis-bold.woff'); font-weight: 700; font-style: normal;}@font-face { font-family: 'Dosis'; src: url('../font/Dosis/Dosis-bold-italic.woff'); font-weight: 700; font-style: italic;}body { font-family: 'Dosis';}

В скрипте вы обращаетесь к классу «block_wr», а в разметке в наличии только «name_block_wr».

Если хотите, чтобы вам помогли, сделайте пример на http://jsfiddle.net/

Возможно я не так понял суть проблемы, но вроде все работает, у кнопки такие же классы, как и у блока.

Тут оценивать, собственно, нечего. Полное несоответствие макету. Зачем вы выкладываете не законченную работу на обсуждение? Из того, что бросилось в глаза: Зачем у body задали overflow: scroll? Все содержимое body нужно положить в общий контейнер и отцентрировать. Пункты меню должны быть текстом, а не картинкой, иконки должны быть отдельно собраны в спрайт, для фона есть градиенты в CSS.

Я так и предложил сделать, с той лишь разницей, что вместо класса использовал атрибут.

Если я правильно понял вас, то можно сделать так http://jsfiddle.net/7GAv8/1/

.carousel-wrap { position: relative;}.carousel-wrap:after { content: ''; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: url('ваша картинка');} А в чем проблема? Переопределяете существующие и добавляете новые свойства.

Подгружайте сами ссылки, а не весь список $('.content').load('/ a.target');

Как вариант http://jsfiddle.net/RSW45/6/ Имеет свои ограничения, но я бы предпочел их комментариям в коде.

div { padding: 1px; }

Это less, если не ошибаюсь, то это равнозначно следующему: li { margin-right: 0;}li.active { ...}

http://scrollrevealjs.org/