Zverushka

-webkit-transform-origin: 0 0; margin-left: 100px; Чтобы понять, почему так. Представь, что ты листик бумаги держишь пальцем в левом верхнем углу и он поворачивается.

@npofopr, верстальщик же должен развиваться, за полгода ты начинаешь верстать без особых проблем, да и верстка осваивается достаточно быстро сама по себе (не 5 лет в институте и не 3, и даже не год самообучения - если говорить об предварительном обучении перед выходом на работу). Нужно дальше развиваться, читать новые книги, информацию, а следующий этап - это js, получается, если ты растешь - то и через 2 года будешь и на js шпарить помимо верстки. А если нет, то возникает вопрос, что это за работник, который за 3 года не поднял свой уровень, а там и остался. Но это лично мое мнение, оно может быть в корне неправильным, прошу за него не пинать.

Где-то читала, что на западе нет понятия верстальщик - только фронт-енд и бэк-енд разработчик. После этого прочтения у меня сложилась в голове картинка - что классический верстальщик - это просто новичок, который растет до фронт-енд по навыкам, просто он еще не все умеет. А фронт-енд может сделать все - и верстку и скрипты. И типа, если ты умеешь верстать и прикручивать пару каруселей на сайт - то ты наверное junior front-end :-). Ну и как может верстальщик может не писать скрипты, а только верстку, а всю Js другой человек - я не представляю. Иногда требуется пол-верстки переделать, чтобы скрипт верно заработал, когда можно было сразу сделать правильно , так что такое разделение труда очень сомнительно... Только если требуется что-то сверхсложное на js - вот тогда это забота javascript-developer, которвый это все реализует... Может ошибаюсь - кто на иностранных биржах сидит - колитесь, как там .

@Евгений_SB, начни с простого, используй просто вложенности и переменные. Остальное подтянется.

@Евгений_SB, мне хватило двух часов изучения less и одного дня работы на нем, чтобы никогда не вернуться на обычный css ни за что на свете.

@Bassline, обожеж ты мой - на виндовс версии с кнопочками это нереализуемо наверное?

@Евгений_SB, у меня чистейшая отсебятина и не с кого было взять пример. Все свои проекты я именую по порядку создаю папку 1 tv, 2 sanki итп, внутри них обычная структура папок для верстки, кроме папки temp - в темпе лежит сам макет псд и его архивная версия, там же файл todo, где я записываю потраченное время и примечания, а также другой мусор. Там же я потом создаю папку edit, в которой хранятся версии сайта после окончательной верстки, когда просят что-то поправить, если первый раз просят поправить - то захожу в temp > edit> 1 - в нем создаю папку save или temp - в ней держу архивную копию сайта или другой мусор. Остальное то классика, редактор sublime text 2 (3) лучше не придумаешь. По поводу Бема думаю, что он небходим в больших проектах, в маленьких, типа лендов или небольших сайтах избыточен. Могу еще поменять мнение. Про гитхаб не знаю.

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

@SelenIT, но ведь в данном случае без прекфикса котята даже не рождаются! (в хроме) http://jsfiddle.net/Zverushka/D3WX2/2/

Эти вопросы мало где освещены, но по сути являются важнейшим базисом верстки, который нужно подробно рассматривать. Потом новичок не знает с какой стороны подступиться к элементу. Судя по коду в голове каша. float: left - это плавающий блок типа display: block и он автоматом переопределяет любой другой стиль, вроде inline-block. То есть что есть там строчка inilne-block, что ее нет - блок подчиняетяс законку позиционирования float: left и только. Однако, если приписать position: absolute - в этом же случае мы также теряем все наши определения видов блоков, чтобы мы там не написали, блок теперь подчиняется своему виду расположения и позиционирования. Поэтому здесь не нужно писать к примеру, display: block, или display: inline-block. Это два основных момента, которые не очевидны новичку. Меню справа и логин форме float right поставить. Для лого можно float left. Эти элементы засунуть в дополнительный блок и вернуть их в поток. Надпись по центру - это просто display:block - что означает, что не нужно вообще эту строчку прописывать. Поставить просто text-align: center Кнопки a - сделать Inline-block, button тег удалить - он нужен для элементов форм, а не для ссылок. Помнить о таком важном моменте, как display:block - изначально растянут на всю ширину родительского элемента (к примеру экрана) и имеет нулевую высоту, поэтому не виден. Верстка во многом строится на лесенке таких горизонтальных блоков, уже внутри которых могут быть кирпичики.

@DivMan, color: red - это цвет текста, которого там нет

http://jsfiddle.net/Zverushka/D3WX2/1/ Вот оно че, Михалалыч.

На какой из запросов среагирует айфон? на @media (max-width: 320px) или на @media (max-width: 640px) ?

@amelice, он в названии темы просил на ajax, видимо текста много, чтобы страничку лишней информацией не перегружать .

Fancybox позволяет ajax, надо просто его документацию почитать и подключить.

@Нарек, надо все-таки выяснить, какая строка помогла, интересно же.

@xzarxzes, да, она.

У меня на винде все нормально. Попробуй прописать следующее * { -webkit-backface-visibility: hidden; } Потом вот так (чисто для теста 2й вариант) * { -webkit-backface-visibility: visible; } Посмотри - меняется что-то или нет. Если прошел баг - нужно поставить не всем элементам на сайте, а только нужным.

Прочитайте Влад Мержевич - верстка веб-страниц (все разложится по полочкам). После этого только javascript и практика верстки. Лично у меня так было. упд... хотя не, есть одна книжка, оч полезная про css3 по сути и изящную деградацию. Ее женщина какая-то написала. Мне тут ее когда-то посоветовали, очень благодарна за нее. Совсем не помню как там кто ее автор и название.

@Нарек, я тоже стала замечать такую фигню в вебкитовских браузерах, в моем случае в хроме. Когда некоторые буквы при наведении на посторонний элемент даже не из их родительского блока - начинают сдвигаться на пиксель-два вверх. Дайте ссылку на ваш сайт)

Вот собственно в чем суть. http://joxi.ru/sgqaU_3JTJBaf3ZkICM Написано,ч то вьюпорт 640, но ширина боди 320 пикселей. Какая же реальная ширина? Так.. посмотрела в browserstack, действительно выглядит как и в хромоэмулятор - 320 пикселей. Ммммммммм. Получается они настолько мелкие? Как же так? 320 пикселей - это же глазок какой-то....

@SelenIT, что такое "апскейл"? я сейчас делаю сайт-кишку, горизонтальный. Длинной 25 тысяч пикселей. Соотвественно там все сейчас на флоатах. При этом он разбит на страницы разной ширины (даже 200 пикселей или 5 тысяч), все это флоат и внутри них - флоаты. Еще этот сайт должен быть адаптивным. Стоит ли заменять мои флоаты на абсолюты? И все это должно быть с паралаксами, анимацией, вот примерно как на этом сайте http://hotdot.pro/ru, но этот сайт расчитан на экраны одинаковой ширины, а мой не подчиняется законам полного экрана , их самописный паралакс-фулл-сайт плагин я разобрать не могу (я фз зачем они его на гитхаб выложили, когда у них даже нельзя самостоятельно указать контейнер для анимации, он вшит как #parallax - впервые такое вижу), сейчас не знаю, что делать, пытаюсь какие-то костыли из разных плагинов городить. С одной стороны мне нужно пролистывать на скролле плавным движением часть экрана, это я делаю через $("body").mousewheel(function(event, delta) { offsetMainLeft -= (delta * 140); $("html, body").stop().animate({ scrollLeft: offsetMainLeft }, function() { animatingScroll = false; }); if (!animatingScroll) { // animatingScroll = true; // applyHorizontalShift(-offsetMainLeft, $(mainLayer)); // offsetMainLeft -= (delta * 140); // setTimeout(function() { // animatingScroll = false; // }, 300) } // applyHorizontalShift(-offsetMainLeft, $(mainLayer)); event.preventDefault(); });По идее вместо анимации скролла на Jquery нужно на трансформах внутренний слой большой анимировать через translate, так как сайт достаточно перегружен и флоатами и скриптами и все это дело боюсь может сильно тормозить, но тогда у нас остается горизонтальный скролл у сайта, который не будет сдвигаться на скролле.. Если его убрать - мы теряем часть юзабилити, нужно оставить возможность скролла по захвату мышкой скроллбара. В качестве паралакса использую stellar, добавляю к его анимации транзиции. И вот на этом этапе то, что кипело в голове, начинает уже испаряться. Пока это выглядит вот так http://html2css.ru/paul/ (пока анимацию делаю только на первом экране), предупреждаю, все еще очень кривое, пока это просто схема, мне нужно понять, могу ли я вообще реализовать все эти гребаные скроллы и паралаксы с анимацией , а потом уже заморачиваться адаптивной версткой.... А еще нужно продумать, как бы скрывать слои, что сейчас невидимы (за пределами экрана) при этом с условием паралакс анимации, которая имеет свойство на другие слои залазить. Как же хочется просто подключить один плагин, который реализует и паралакс, и плавную прокрутку рывком и горизонтальный скролл, решив все эти проблемы с производительностью и подобными ньюансами - но такой не нашла.

$('.CotTopLine, .NewsLetterTop') вот так надо писать - через запятую внутри кавычек. Лучше прочитать книжку по основам, иначе потом замучаешься клипать скрипты, больше будешь думать, как сделать какую-то фишку, когда она одной строчкой реализуется уже встроенной функцией). Или будешь как я $("ul").parent().parent().parent().parent().parent() выборку делать )), хорошо, что меня на этом сайте вовремя за руку поймали))), правда я писала такое после внимательного прочтения книги orelly (неплохая, но этот момент был упущен).

300 кб для 3000пиксельной картинки разве много?

Не помогло к сожалению. Ховеров нет. Плохая у меня манера на пальцах пытаться объяснять. Вот для примера лаги (крутим горзонтально) http://jsfiddle.net/Zverushka/X9KX9/embedded/result/ - лагающая версия. открывать на весь экран. Выдает 30 фпс на прокрутке в среднем. http://jsfiddle.net/Zverushka/X9KX9/1/embedded/result/ - нелагающая - 50-60 фпс на прокрутке.... Блин обожаю хром, он такой быстрый, но это уже второй случай сильного падения производительности в моей практике, какой же он двуликий