Killerblade
-
Posts
20 -
Joined
-
Last visited
-
Days Won
1
Content Type
Profiles
Forums
Calendar
Store
Posts posted by Killerblade
-
-
<footer class="footer"> <small class="copyright">Fiesta-Viva.by 2014</small> <span class="address">Адрес: г.Брест ул.Карьерная 12</span> <span class="time">Время работы: 9:00 - 20:00 Без выходных</span></footer>
Ну допустим так, но можно сделать еще лучше использую микродату http://schema.org/address, http://schema.org/openingHours
Такой вопрос по разметке. В приведенном примере, у нас .footer выступает блоком во всю ширину, но нам надо разместить элементы о центру с огранничиной шириной (допустим 960). Как нам это сделать ?
-
Лично мне кажется вы решили сверстать на 100% html 5, не зная тольком что означают эти новые теги. Вы либо верстайте дивами, либо разберитесь оснавательно для чего нужны article, section итд.
Да.. есть такое. Только я думаю что для тега footer я не смог бы пободрать нужных тегов из набора html5
<footer class="footer"> <section class="footer-section"> <article class="copyright">Fiesta-Viva.by 2014</article> <article class="address">Адрес: г.Брест ул.Карьерная 12</article> <article class="time">Время работы: 9:00 - 20:00 Без выходных</article> </section></footer>
Преположим переделать этот блок.
В таком варианте мы заменяем абзацовый тег article на тот же абзац p
<footer class="footer"> <section class="footer-section"> <p class="copyright">Fiesta-Viva.by 2014</p> <p class="address">Адрес: г.Брест ул.Карьерная 12</p> <p class="time">Время работы: 9:00 - 20:00 Без выходных</p> </section></footer>
Но не решенный варинат становится с .footer-section
-
При помощи ul>li а так же с помощью before & after для элементов списка
- 1
-
А вы заголовками не пользуетесь, вы решили все div заменить на section ?
Спасибо, я ждал этого вопроса. Да я решил заменить их всех на section. Только правда не понимаю, правильно ли я делаю. Валидатор конечно ругается что нету заголовочных тегов. Тут та я и решил поинтересоваться у вас, может знает кто как задобрить валидатор с этой ошибкой.
Вот результат валидации. http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fimperata.by%2Ffiesta%2F
-
Кнопка "Найти" заезжает на "Поиск товара", особенно это заметно, если сфокусироваться на этом поле. Считаю, так будет покрасивее:
.header .header-section .header-aside .search .search-submit {border-top-left-radius: 0px;border-bottom-left-radius: 0px;}
Другой вариант:
.header .header-section .header-aside .search .search-submit {top: 4px;right: 4px;height: 29px;border-radius: 4px;}
Согласен, так будет красивеет. Но дизайн, шаг в право, шаг в лево - растрел ! На щет того что в firefox немного не стыкуется при фокусе на инпут, в курсе. Еще раз спасибо.
-
Может я чего то не понимаю, но зачем футеру давать класс footer?
Что бы проще было выцепить самый главный футер из всех.
-
Ну или через стили, для последнего блока :last-child повернуть выпадушку в другую сторону.
да, так более правильно, и самомен. ллучше реализовать на уровне css. Но лучше будет сделать классы для последних 2х элементов.
Если условия верстки не подрузмевают IE < 8 верстии то можно использовать last-child -
Всем привет.
Верстаю в принипе давно, но вот сейчас хотел посоветоваться, может я что не так делаю.
Пишите пожалуйста все замечания которые найдете, буду рад к конструктивной критике этого проекта.
Вот собственно сам проект: http://imperata.by/fiesta/
Очень интересно узнать ваше мнение. После небольшой критики у меня будут еще пару вопросов. Возможно вы знаете как их решить, а пока что хочу услышать ваше мнение.
-
И так проблема решилась. Все оказалось довольно просто.
Для начала я полез в настройки браузера. Там было довольно интересно окошко настроики внешнего вида > http://clip2net.com/s/78E3zZ
После того как я по балывался с уровнями сглаживания шрифтов http://clip2net.com/s/78E5tG, меня осенило, как задать метод сглаживания.И вот оно решение:
ps: http://htmlbook.ru/blog/sglazhivanie-shriftov-v-safari
body { -webkit-font-smoothing: antialiased; }
Вот еще варианты этого свойства:
- none — сглаживания нет;
- subpixel-antialiased — сильное сглаживание;
- antialiased — среднее сглаживание.
- 2
-
Появилась такая пробема только в Safari 5.1.7. Подключен нестандартный шрфит PT Sans.
Вот отображение в браузерах FF GH OP http://clip2net.com/s/78CVLqB вот что мне показывает Safari http://clip2net.com/s/78Db8c Тогда как в другом блоке http://clip2net.com/s/78Dcmw в том же браузере, все нормально.
Явно заметно пропала четкость. Может есть идем как устранить это.
-
Учись создавать структуру кода, по макету. В голове. Если вначале не получается. Записывай или рисуй на листике
-
Да да... .stop() - за рулило конкретно. И так... сейчас расскажу суть моего утреннего мозгового штурма.
Первый штурм начался еще далеко за неделю до того пока мне не сказали исправить этот баг. Код был выше указанный.
Посидев поломав голову и полностью подумав о смысле жизни, о бубнах, котиках, пандах, и другой херни которая приходит рано утром. Я подумал зачем я в этом коде
$(".section-top-menu-content li").hover( function () {$(this).find(".section-top-menu-sub").stop(false, true).slideDown('fast');}, function () {$(this).find(".section-top-menu-sub").stop(false, true).fadeOut('fast');} );для двух сотояний стопаю анимацию.
Выход был найден используя следующий код
$(".section-top-menu-content li").hover(
function () {
$(this).find(".section-top-menu-sub").stop(true, true);
$(this).find(".section-top-menu-sub").slideDown('fast');
},
function () {
$(this).find(".section-top-menu-sub").slideUp('fast');
}
);Это один вариант решения этой задачи... потом пошло по накатанной и я придумал еще одни способ решения проблемы с миганием.
$(".section-top-menu-content li").hover(
function () {
$(this).find(".section-top-menu-sub").stop(true, true);
$(this).find(".section-top-menu-sub").slideDown('fast');
},
function () {
[color=#ff0000] $(this).find(".section-top-menu-sub").stop(true, false);[/color]
$(this).find(".section-top-menu-sub").slideUp('fast');
}
);Расскажу в чем отличие первого варианта от второго.
По наведению на возбуждаемую область анимации она проигрывает анимацию. По прекращению ховера по возбуждаемой поверхности инмация не прекращается а всего лишь убирается из очереди, и повторения не происходит.
Второй вариант, помогает от задротов порыхлить бугорок на таких ссылках. Он в обще не дает вам побаловаться открытием drop пока вы всерьез не остановитесь на нем. Иначе просто при простом проведении курсора, он лишь превстанет и по уведению курсора упадет.
-
В общем такая проблема:
Написал этот код CSS:
<div class="section-top-menu-content">
<ul>
<li><a href="#">Главная</a><span></span></li>
<li class="activ">
<a href="#">Каталог<span class="arrow"></span></a><span></span>
<div class="section-top-menu-sub">
<a href="#">Шины</a>
<a href="#">Диски</a>
<a href="#">Аккумуляторы</a>
<a href="#">Элементы крепления</a>
</div>
</li>
<li><a href="#">Акции</a><span></span></li>
<li><a href="#">Новости</a><span></span></li>
<li><a href="#">Информация</a><span></span></li>
<li><a href="#">Вакансии <span></span></a></li>
<li >
<a href="#">О компании<span class="arrow"></span></a><span></span>
<div class="section-top-menu-sub">
<a href="#">Самый большой текст с вакансиями</a>
<a href="#">Еще один самый большой большой текст</a>
<a href="#">В 1940 году в небе над Австралией столкнулись </a>
<a href="#">Морально устал – хочу отдохнуть аморально.</a>
<a href="#">Мозги,конечно не видны,но когда их не хватает,заметно</a>
<a href="#">Женская логика — «Лучше по-хорошему скажи, иначе я сама додумаю, хуже будет!»</a>
<a href="#">Элементы крепления</a>
</div>
</li>
<li>
<a href="#">Контакты<span class="arrow"></span></a><span></span>
<div class="section-top-menu-sub">
<a href="#">Самый большой текст с вакансиями</a>
<a href="#">Еще один самый большой большой текст</a>
<a href="#">В 1940 году в небе над Австралией столкнулись </a>
<a href="#">Морально устал – хочу отдохнуть аморально.</a>
<a href="#">Мозги,конечно не видны,но когда их не хватает,заметно</a>
<a href="#">Женская логика — «Лучше по-хорошему скажи, иначе я сама додумаю, хуже будет!»</a>
<a href="#">Элементы крепления</a>
</div>
</li>
</ul>
</div>
</div>И потом задал ему некоторые стили, для красоты. Потом решил заставить это все дело работать.
И написал код JQ:
$(".section-top-menu-content li").hover(
function () {$(this).find(".section-top-menu-sub").stop(false, true).slideDown('fast');},
function () {$(this).find(".section-top-menu-sub").stop(false, true).fadeOut('fast');}
);После чего все замечательно работало. Но когда я сверху быстро переношу фокус на подменю, оно почему то начинает мигать. В общем Получается очень не красиво.
Може кто сталкивался с такой проблемой ? Был бы очень рад вашей помощи.
-
Как то так.
$("img").hover(
function () {
$(блок с картинкой).stop(false, true).fadeIn('fast');});
},
function () {
$(блок с картинкой).stop(false, true).fadeOut('fast');
} -
Использую jScrollPane - v2.0.0. С обычным jQuery Javascript Library v1.8.3 не работает прокрутка мышью. Когда же подключаю jQuery 1.2.6 - New Wave Javascript то все работает норм.
Вопрос, почему не работает прокрутка мышью с новыми версиями JQ ?
-
Если тебе надо именно таблицами. Можно сделать так.
- Создаем таблицу, пусть даже 3 строки, 1столбец.
- Отрезаем картинки со скруглениями (верх, низ), ложим ее в первую и последнюю строку.
- В верхней строке, создаем span. В него пихаем текст
- Задаем оставшиеся стили для центральной ячейки, в основном это бордеры.
<table width="325" height="178" border="1">
<tr>
<td height="29">Картинка свеху + span с текстом</td>
</tr>
<tr>
<td height="113">Тут основной текст, задаем боковые бордеры</td>
</tr>
<tr>
<td>Картинка с нижним закруглением</td>
</tr>
</table>border="1" - хоть не забудь поменять на 0 !
- Создаем таблицу, пусть даже 3 строки, 1столбец.
-
Проводите чщательный анализ psd макета, лучше вначале потратить часок другой на изучение всего макета в подробностях, чем потом что то высчитывать.
- Пиксель в пиксель не попадает никак
- Явные отклонения по цвету, особенно ".opacity"
- Выравнивание в input (subscribe), сделать плейсхолдером
- Поиск в обще не работает
- и ориентируйтесь на все мониторы
http://clip2net.com/s/581dr4 - тут видно )
В общем на остальное времени не хватило. Для начало замечательно, дело наживное, есть куда стремиться, надо вначале замучать тебя, что бы потом легче было. Ну и скажи еще сроки сколько ты это делал ?
- Пиксель в пиксель не попадает никак
-
Таблица и скругленные углы, это как инь и янь, они не могут быть совместимы ! Хатя есть свои замуты это сделать, я бы лучше слал 2 строки одной текст впиндюлил, а другой картинку фоновую со скруглением.
-
Вот еще один http://dimox.github....ormStyler/demo/
Сам недавно юзал его, если надо могу помочь разобраться. Там проблемки есть, не без этого.
Оцените пожалуйста верстку
in Discussion of works
Posted · Edited by Killerblade
Вот почему div. Почему не section, article ?