Zverushka

Вродь ничего писать не надо и будет само сжиматься под ширину экрана.

Вот я залила свой старый сайтик, там не совсем то, что нужно, но принцип похож. На самом сайте есть список превьюшек для слайдера - по клику на них открывается модальное окно, уже установленное на нужном слайде. И само модальное окно представляет из себя обычный слайдер. Добавить внутри модального окна thumbs или снаружи нет разницы. http://html2css.ru/pilesos/ - afterShow: function(){ // var sliderTextHeight = 0; if (!si || !st) { $(".catalog-slider .catalog-text li").show(); st = $(".catalog-slider .bx-slider.catalog-text").bxSlider({ mode: 'fade', pager: false, controls: false, adaptiveHeight: true, }); si = $(".catalog-slider .bx-slider.catalog-images").bxSlider({ mode: 'fade', pager: false, nextSelector: ".catalog-slider .bx-next", prevSelector: ".catalog-slider .bx-prev", onSlidePrev: function(){ st.goToPrevSlide(); }, onSlideNext: function(){ st.goToNextSlide(); } }); } }Нужно добавить после запуска фенсибокс функцию - проверить создан или нет слайдер (si, st у меня - сори за тупые названия, фз почему такие дала), если не создан слайдер - тут же создаем.

@CroaToa,дада, это я скосячила и тут же передалала на нужный вам вариант, посмотрите еще раз - я тот пост отредактировала http://jsfiddle.net/Zverushka/9Ek5e/1/

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

http://jsfiddle.net/Zverushka/9Ek5e/1/ вот так?

@npofopr,а что именно вызывает затруднение? .modal>#slider-1 modal - Это фенсибокс - #slider-1 - это сам слайдер. Правда его нужно динамически создавать после открытия fancybox окна.

Я на триале сижу, завожу новые почты. Подумываю объединиться с кем-нибудь и оплачивать, но не сейчас, а в будущем). У меня в формах есть идентификаторы форм, а также достижение целей метрики. И когда их 7 штук на странице - нужно проверить, та ли цель достигнута (часто ошибаешься), тот ли идентификатор вписан в Hidden тип формы - вроде "отправка с формы номер 3" - это данные тоже учитываются на почте. Или же прикол с щелчком по кнопке в каталоге заказать нужный товар, а форма на всплытии везде одна - нужно сделать, чтобы при отправке учитывались разные виды целей, да и тип формы был нужны, например "товар длинные бигуди" - и это все надо сверить, не возникло ли где-нибудь ошибки, ведь кроме меня над сайтом никто не работает, а заказчик получит слишком неприятный сюрприз, если данные придут неверные.

Почему сразу 35? может и 100 быть, все зависит от объема работы. Вот, к примеру 10 часовой сайт и его обработка по пунктам, правда они были немного другими на тот момент 40мин ушло, при этом я это время включаю в оплату. Основная сложность идет с проверкой отправки форм - вот на этой части я обычно больше всего времени трачу и меня от нее тошнит, потому что всегда куча косяков и проблем вылазит, а все эти сверки, масштабы - фигня...

Например, если твой сайт просматривают с планшетов с другим разрешением - он автоматически уменьшится (без запрета на уменьшение)- и могут вылезти артефакты от спрайтов. Да, я никогда не ставлю - полный масштаб для таких дейвасов. По-моему намного удобнее обозревать целый сайт сразу - понятно что и где находится, да и часто уменьшение идет небольшое. И сайт и выглядит красиво и читать/пользоваться им удобно. Плюс у меня был случай - заказчик смотрит с того же браузера, что и я и говорит, что там что-то вылезло, мы целый час сидели вместе думали, что за фигня. Оказалось, что у него машстаб 0.9. ). Опять же это не сложно поправить, а если верстаешь с учетом таких проблем, то можно их избежать и вообще по всем пунктам больше пробегаться, через разбираться с чередой проблем. Для меня проще сразу сделать, чтобы все работало, чем выслушать ряд правок и претензий, что где-то что-то не так и во многом - сколько я лишнего времени затрачиваю - часть этого время я все равно экономлю на возможных проблемах при проверке сайта и претензиях, когда все равно придеться исправлять, вникать еще в описываюмую проблему, заново открывать сайт, смотреть на него, отрываться от основной работы - что очень нездорово выбивает из колеи. Сервис http://www.browserstack.com/

Итак, сделав основую верстку, с плывающими окнами и скриптами нужно пройтись по нижеследующем пунктам, прежде чем отдать сайт заказчику. После каждой своей верстки я прохожусь по каждому из этих пунктов. Часть из них относится только к верстке landing page. Завершение проекта 1) Просмотр страницы в разных масштабах(zoom) и разрешениях. Здесь обычно всплывают такие проблемы - как неверное масштабирование спрайтов, лишняя прокрутка страницы, съезжание некоторыъ элементов. Некоторые люди любят смотреть сайты в 0.9 или 1.1 масштабе и у них сайт тоже должен выглядеть нормально. 2) Проверка работы javascript - все ли скрипты подключены, нет ли ошибок, проверка usability сайта, подсветки ошибок отправок форм, реакции на hover, active. 3) Валидация html css Тут все понятно, всплывают опечатки, в css или html, а также некоторые ошибки, это все нужно поправить. 5) Чистка html, javascript Удаляем из базового шаблона, на основе которого делалась верстка, лишние javascript плагины, удаляем лишние закомментированые и ненужные куски кода. Код должен быть чистым и аккуратным. 6) Окончательная сверка с макетом Чрезвычайно важный пункт. Так как в процессе верстки часть стилей могла перезаписаться другими, съехать отступы или даже банально - можно было упустить некоторые моменты. Обычно на этом этапе отлавливается много косяков. Накладываем pixel perfect - и смотрим. 7) Проверка орфографии. Этот пункт нужен только верстальщикам лейндинг пейдж, где сайт делается под ключ и контент-менеджеров не предвидется. Чтобы потом вас не задалбывали правками, что где-то пропущена запятая или написано с маленькой, а не большой буквы. 8) Оптимизация изображений и шрифтов Оптимизируем большие изображения, прежде всего касается png, мелкие - кодируем в base64, шрифты - проверяем все ли использовались, что были приложены к проекту - лишние комментируем на будущее. 10) Проверка отправки каждой формы Пункт относящейся опять к LP верстке под ключ. Отправляем каждую форму из любимого браузера - проверяем на почте - все ли правильно. 11) Проверка кроссбраузерности + одна отправка форм Смотрим сайт в ie, firefox, chrome, opera - заодно в каждом из них делаем одну отправку формы. Известны случаи, когда отправка формы не работает только, например, в файрфоксе. 12) Удаленная проверка Заходим на сервисы удаленной проверки - для проверки сайта на mac os (здесь я проверяю только в сафари), ie8, android планшетах, ipad'е. Как они выглядят - нет ли багов, глюков, желательно делаем отправку формы (опять же, в и8 легко славить с формой глюк). Ну все - сайт оттестирован и отполирован - можно отправлять заказчику. Если у вас есть какие-то варианты с дополнительными пунктами - пишите, интересно послушать.

Хочу поделится слайдером галереи, который мне пришлось написать пару месяцев назад в связи с тем, что ничего подобного не удалось найти в интернете. Делала как понимаете, не для себя, а для макета, в котором фантазия дизайнера зашла так далеко. Работает на транзициях современных браузеров. Основная особенность: 1) Слайдер заточен на рисунки разной ширины. 2) Все рисунки должны уложиться в 2 ряда и при этом иметь justified выравнивание не смотря на разные размеры. 3) При наведении на левую и правую сторону слайдера - должна срабатывать прокрутка. 4) Слайдер должен растягиваться на разную ширину экрана. 5) Для слайдера используется дополнительный аддон - imagesloaded.pkgd.js - для определения загрузились ли картинки. Сразу оговорюсь, что я уже не могу разобраться в той абракадабре, которую написала. Дело было глубокой ночью. И кажется там есть мелкие глюки, но в целом оно как-то работает, хоть и не идеально. Вдруг кому-то пригодится или мало ли что - в общем делайте с этим, что хотите, хоть новый нормальный слайдер . http://html2css.ru/slider/

Вообще не вижу проблемы - слайдер внутри фенсибокса и все.

@SelenIT, я вот об этом - http://jsfiddle.net/Vn5kW/ смотреть в файрфоксе и... любом другом браузере, то есть он не понимает существования такого шрифта как Arial Black - он думает, что есть Arial, а black - это жирнота и чтобы его включить нужно установить font-weight. Лично я его поведение именно так трактую. Если винда стоит с установленным шрифтом конечн. огооо, клево. А говорили, что не баг, а фича это и типа так даже правильнее =)... еще ток года 2 ждать после выхода новой версии, прежде чем можно будет без зазрения совести пользоваться позиционированием ...Ну и это лично мой опыт, что больше всего различий в кроссбраузерности из всех современных браузеров я встречаю в файрфоксе. А так особых различий я больше-то и не припомню у каких-то других браузеров. П.С. - Я что, чей-то любимый браузер обидела?

http://plugins.jquery.com/ вот тут в поиске вводишь.

Поздравляю! Какая посещаемость ресурса?

Лучше подумать об отличиях всех браузеров от файрфокса, например прикола с позиционированием в табличках, толщиной букв в шрифтах типа Arial Black итп. Если что-то наверстал, лучше тут же глянуть, не развалилось ли это там, пока начинаешь еще набираться опыта.

Во во. Я чисто ради приличия об этом не написал... В его понимании - твои 8 часов работы - его пол часа болтовни????))))))) Скорее он предполагал, что полчаса его рассказа равны трем часам работы, по его оценке. Что тоже не очень адекватно).....

Да он уже в черном списке Мне такие знакомые и даром не нужны. Полчаса он про метрику порассказывал

@klierik,ага, пришлось новый класс кнопок создавать - у них цвета и размеры не те, бороться с тем, чтобы они по ширине в ряд уложились от края к краю, обычные btn-group-justified не подходил - делал их квадратными, что тоже вызвало много проблем. Грю же - это был товарисщ, с которым были "приятельские"отношения, в итоге полчаса его консультации оказались равноценны такой верстке без оплаты, я вообще согласилась на 20 у.е., чтобы только сделать одолжение, так как уже неделю верстала без передышки и спала по 4 часа. Но решила удружить .

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

Не, ток это, что на картинке и все.

Ну как я считала мы с приятелем, как мне казалось ранее, договорились о верстке за 20 у.е. в обмен на то, что он мне объяснит чего от меня в метрике хочет заказчик. Цели и все прочее я умела прикручивать и только не могла понять, что значит "источник трафика, кампания, ключевое слово". Вот в обмен на получасовой рассказик о том, что в метрике можно добавить параметры - я сверстала, как позже оказалось бесплатно. Ведь 20у.е. это была, оказывается, гипотетическая цена макета, но мы, по его словам, договорились в обмен на консультацию по метрике. Такие дела. Вот это оказывается речь об оплате не шла. Меня деньги не очень волнуют, так как сумма была названа итак больше символической, а вообще восприятие данной ситуации с общечеловеческой точки зрения совести и справедливости. Я конечно с бустрапом не очень дружу и поэтому просидела 8 часов, мне интересно сколько бы ушло у специалиста на это время. И мне интересно - можно ли было уложиться в 3 часа. Думаю за 6 часов можно-то.

Мне прост говорили, что это на 3 часа работы. Пытаюсь оценить, насколько у меня нарушена скорость работы.

Интересуют мнения всех, кто зарабатывает версткой на жизнь! Даже если у вас столько же - 5-6 часов займет, как у отписавшихся выше - все равно скажите - я хочу статистику подбить.

@nerv, меня больше удивляет, зачем это нужно.