vladmih

Помогите плиз найти библиотеку, в которой прокрутка бы работала таким способом как тут http://rambler-co.ru/

для каждого блока с картинкой вместо float:left пишем inline-block, а для родителя пишем горизонтальное выравнивание по центру

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

Я просто смотрел пару pie (круговые диаграммы), типа как на awwwards у них клипы резали по кругу. Возможно я не понял, полную идею клипа там, но в общем как делать круговую, я так и не понял... В общем, спасибо за решение, реально годное, и много где может пригодиться теперь!

Понял, спасибо за такое оригинальное решение, как оказалось все гениально и просто! А еще вопрос, с clip такое реально сделать? Я им еще не разу не пользовался, но просто возможно это еще один метод?

А в чём проблема? Вы код смотрели вообще? Всё же на блюдечке, бери и пили под себя: расположение круга можно задавать какое угодно; ховер сделан для наглядности, можно и без него делать. Смотрел, конечно... Я понял, что серый фон вы сделали блоком с бордером, а рамку в другом псевдо классе, просто я думаю, если картинка к примеру имеет размер 500*500 то и бордер плимерно должен иметь такую ширину...? Я правильно понимаю?

Да, но это подходит если, круг в центре, а если он в произвольном месте? этот круг может появится на любом из домов... Он не при ховере, а просто у каждого дома будет координата, которая позиционируется на доме...

И к чему его добавлять? Висибл не поможет... Примерно представим: <div class="wrap"> <img src="tra-ta-ta"> <div class="ring"> <div class="overley" </div> Оверлей темный поверч картники абсолютно, с бОльшим зиндексом, кружок, поверх оверлея, но внутри кружка я буду видеть верлей, а не картинку...

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

http://take.ms/g973S Реально реализовать такое на чистом css? Любой способ... Была идея светлую картинку затемнять прозрачным темным слоем через псевдоэлемент, но как потом кругом снова засветить? Как такое можно реализовать?

Решено: -webkit-transform: translateZ(0); к хедеру... Самое интересное анимаций нет совсем... Воть с этим все гуд... Хром меня разочаровал... Такие косяки... Закройте тему плиззз

Анимаций и трансишенов нет... Создается такое впечатление, что при скролле каждый раз блок прыгает от абсолютного позиционирования в фиксированное... Хз... Печаль...

Нет, анимаций нет. Хедер просто прилипет вверх, когда страница прокручивается до него. Мерцание только когда скролю мышкой. Если скроллю, стрелками или полосой прокрутки такого мерцания нет...

Гуру, подскажите что я делаю не так? Есть шапка, которая имеет такие стили header {position: absolute;width: 100%;top: 150px;height: 85px;z-index: 10;background: url(../img/head-line.png) repeat-y center center;} При скролле страницы я добавляю класс, и она прилипает к верху: header.fixed-top {position: fixed;top: 0px;} И сам код: $(window).scroll(function(){if ($(window).scrollTop() > 150) {$('header').addClass('fixed-top');} else {$('header').removeClass('fixed-top');}}) Суть в том что в хроме когда скролю страницу, появляется мерциание этого хедера. Не пойму в чем косяк, ведь раньше так делал и не было таких проблем...

Мне кажется к wraper можно было бы паддингы по сторонам добавить или шиться целой куши лишний стилей тип: margin: 0 auto; width: 935px;

1. Кнопка является дивом, а внутри ссылка, соответственно, юзеру нужно тыкать именно на текст, что есть не юзер-френд, и ховеры!!! Ребят, ховеры! Не видно обратной связи с пользователем. 2. в лого div не обязателен, можно было бы просто к ссылке этот класс применить... 3. Как придирка, не понятно как выглядит активный пункт меню... Подразумеваю что так же... 4. banner я бы сделал так... Див с классом баннер, внутри картинка, и там же лежит заголовок и span к примеру, в итоге убираем классы лишний див обвертки и пишем стили так banner > h1, banner > span, banner > img 5 .feature_row , galery_row , info_row, client_row я бы сделал списками... Я думаю это более было бы семантичнее ИМХО. 6 footer_menu булиты квадратные есть и в css, не вижу смысла делать картинкой... На крайняк, псевдоклассами... Убираем лишний запрос к серверу на картинку... Возможно придирки, но я бы сделал так... Для первой в целом, не плохо! Моя первая была вообще писец...

Я вот не пойму почему просто нельзя шапке написать fixed и top 0px ? Стандартное решение, везде так делаю, если меню не "въезжает и не выезжает"? Без использования скрипта, без лишней нагрузки на клиента... И тоже не понял, зачем социалки крутить скриптом. Можно ведь просто через ховер...

Блин, по хорошему мне нужен симбиоз из двух этих библиотек. Инициализация прокрутки как у one page, а эффект как у curtain. Переписать, еще левел не тот... Видел пару раз такие реализации на awwards, но вот снова найти не могу...

На сколько я понимаю у начинающих HTML5 - это использование семантичных тегов header, footer, nav и т.д. Не говоря уже использовании таких вещей как новые type для инпутов и еще целой кучи плюшек... Которые в нем есть... Будучи верстальщиком уже около 1.5 лет... Я не могу сказать что знаю весь HTML5.

Может я не правильно задам вопрос, но зачем bootstrap на странице?

Я не понял, что значит "__"... Может мой вопрос туп? То извините...

Извините если не туда... В общем прошу помощи, возможно кто-то видел готовый плагин, или туториал, по его созданию. Есть плагин curtain вот пример его работы http://llidesign.co.uk/iconic-furniture/#section-1 Ищу плагин который работал бы по аналогии с этим, но чтоб скролл был не системный, а крутил один "слайд" на прокрутку колеса мышки как тут http://www.thepetedesign.com/demos/onepage_scroll_demo.html

Есть вариант как протестить под виндой яблочный сафари? Не считая виртуальной машины?)

Тестил под виндой. Этот вопрос решил, ездящий блок был в float блоке, и по этому он считал не правильно, но теперь хром отдает 604 px. вместо, нужных 513... И получается неприятный прыжок...

var ofTop = $('#toScroll').offset().top; $(window).scroll(function(){ var scTop = $(this).scrollTop(); console.log(ofTop,scTop) if ( (scTop + 20) > ofTop ) { $('#toScroll').addClass('fixed') } else { $('#toScroll').removeClass('fixed') } }) Есть блок который должен ездить при скролле страницы, аля bootstrap. в хроме, мозиле, опере все работает в сафри нет вывел в консоле ofTop в хроме, мозиле, опере отдает правильное значение 519, а в сафари 2561... Что я делаю не так?