sifilis
-
Posts
28 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by sifilis
-
Перемещение родительского блока через transition
sifilis replied to sifilis's question in HTML Coding
Печалька. Спасибо за отклик на мою проблему. -
Здравствуйте. Вопрос. Есть структура вида: <section> <div> блаблабла </div> </section> Как на css записать уменьшение у section css-свойства left на 100 пикселей по клику на дочерний div через transition?
-
У кого есть опыт в этом деле, помогите с выбором. Есть ftp-сервак с сайтом, есть 5 человек, которые работают над сайтом: кто-то вёрстку правит, кто-то код. Понятное дело, что без контроля изменений файлов тут не обойтись. Вопрос: а что выбрать? Что-то такое, что в качестве центрального хранилища использует FTP, куда подгружает изменённые файлы с локального репозитория. Или хотя бы дайте что-нибудь почитать на эту тему. Гугл смотрел, там наркоманство сплошное.
-
Всем здрасьте. Решил сделать собственную карусель, с гейшами и нардами, в итоге родил вот такую небольшую кодовёрстку: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <title>Фотон</title> <script type="text/javascript" src="http://yandex.st/jquery/1.7.2/jquery.min.js"></script> <script type="text/javascript"> jQuery(document).ready(function() { $("div.children").each(function() { $(this).css("width", $(window).width()); }); $("div.parent").css("width", $("div.children").size() * $(window).width()); $(window).bind("resize", function() { $("div.children").each(function() { $(this).css("width", $(window).width()); }); $("div.parent").css("width", $("div.children").size() * $(window).width()); }); $("a.next").click(function() { $("div.children").eq(0).animate( { marginLeft: -1 * $(window).width() }, 500, function() { $(this).appendTo($("div.parent")); $(this).css("margin", 0); } ); }); $("a.prev").click(function() { $("div.children").eq($("div.children").size() - 1).css("visibility","hidden"); //на всякий случай скрываем элемент $("div.children").eq($("div.children").size() - 1).prependTo($("div.parent")); //перемещаем элемент в начало $("div.children").eq(0).css("marginLeft", -1 * $(window).width()); //отбрасываем элемент влево $("div.children").eq(0).css("visibility","visible"); //отображаем элемент обратно $("div.children").eq(0).animate( {marginLeft: 0}, 500 ); }); }); </script> <style type="text/css"> * { margin: 0; padding: 0; } .parent { height: 100px; overflow: hidden; } .children { float: left; height: 100px; } </style> </head> <body> <div style="" class="parent"> <div style="background: red;" class="children"></div> <div style="background: black;" class="children"></div> <div style="background: green;" class="children"></div> </div> <a href="#" title="" class="prev">Туда</a><br /><br /> <a href="#" title="" class="next">Сюда</a><br /><br /> </body> </html> Однако есть небольшая проблема: нижняя полоса прокрутки жиреет без стыда и совести на всю ширину блока с классом parent. Единственный вариант как убрать нижнюю полосу прокрутки вижу только в том, чтобы задать для overflow-x: hidden для body. Но тогда нижняя полоса прокрутки вообще никогда не будет показываться, а хотелось бы, чтобы она появлялась (естественно, что не во всю ширину блока с классом parent) при ширине браузера меньше 1000 пикселей. Какой выход можно найти из этой ситуации?
-
Ну вот представим ситуацию. Есть у нас горизонтальное меню, в котором для выделения активного раздела тегу li добавляется фоновый цвет (все остальные имеют background transparent). И тут каждый браузер начинает добавлять свои отступы к верху. То есть у меня по дизайну между верхней частью буквы "Т" и верхней частью бекграунда 5 пикселей, а браузер добавляет ещё 5 пикселей. И получается у нас вместо 5 пикселей 10. Лажа получается.
-
И что получим в итоге? Хотя, возможно, я чего-то не понимаю? Получим, что при значении 0.7 текст прижимается к верхней части. Я просто почему это спрашиваю, надоело, что при вёрстке меню каждый браузер постоянно добавляет свои отступы для текста сверху.
-
Создаём простенький html-документ следующего содержания: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Paddings</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <style type="text/css"> * { margin: 0; padding: 0; outline: 0; border: 0; } div.redBlock { margin: 100px; width: 300px; height: 50px; background: red; font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; font-size: 10pt; color: white; } </style> </head> <body> <div class="redBlock"> This is example. </div> </body> </html> В теории у нас текст должен примкнуть к левому верхнему углу блока с красным фоном. Но давайте откроем тестовую страницу, к примеру, в Firefox 14.0.1, сделаем скриншот и посмотрим что у нас на самом деле (прикрепляю скриншот к теме). А получается у нас, что от левого края у текста остаётся 1 пиксель, а от верхнего края аж 9 (ДЕВЯТЬ!!!) пикселей! Что это за пиксели? Я их не звал, так чего они пришли?
-
До какого момента? Должен быть предел, после которого разница в пунктах и пикселях становится явно заметной.
-
И как тогда быть с вёрсткой? Пункты не совпадают, пиксели не совпадают. Какое решение?
-
Так. Фотошоп исходит из 72 пикселей на дюйм (так было в 90-х на Маках). По стандарту CSS, в дюйме 72 пункта, но 96 пикселей (так чаще всего получалось в реальности, когда стандарт писали). Если в фотошопе выставить 96dpi, то и пиксели, и пункты будут соответствовать CSSным (но рендеринг шрифтов всё равно может отличаться). То есть если я вижу в макете размер в 12pt, то надо макет переделать в 96dpi? А как это сделать? Да. 1px = 3/4pt = 1/96in. По умолчанию (если не переопределять font-size для body) в соврем. браузерах 1em = 12pt = 16px = 1/6in. Не понял. 12 / 4 * 3 = 9, но не 16. Открыл ради интереса макет в закромах, в меню у текста выставлено 12pt. Измерил линейкой буквы: прописные в 7 пикселей, заглавные в 9. Получается, что 12pt - это 9px по заглавной букве?
-
Поддержу автора вопроса. Зачем использовать непонятные em, значения которых зависит от какой-то родительской величины, когда можно просто использовать пиксели, чтобы по максимуму соответствовать макету дизайна?
-
Тоже пробовал, не срабатывает. Не работает и $(this).is(":empty") О, вот это работает! if ($(this).text() == '\xa0') { alert("fsfdsdf"); }
-
Есть элемент следующего вида: Мне надо на jQuery выбрать все такие элементы и преобразовать у них css. Делаю вот так: $("p").each(function() { if ($(this).text() == " ") { $(this).css("lineHeight","10px"); } }); И ни фига. Но при этом код следующего вида работает: $("p").each(function() { $(this).css("lineHeight","10px"); }); ИЧЯДНТ?
-
С каких-то недавних пор стал замечать вот какую вещь. Тыкаю я на странице правой кнопкой на каком-нибудь элементе, жмякаю «Инспектировать элемент с помощью Firebug», в окошке Firebug происходит перекидывание на инспектируемый элемент. В общем вроде бы всё как обычно. Но недавно стала проявляться вот какая вещь. Если на странице есть повторяющийся Javascript (например слайдер, который автоматически показывает новый элемент через заданный промежуток времени), то в окошке Firebug происходит перебрасывание с инспектируемого элемента на элемент, в отношении которого исполняется Javascript. Можно ли как-то отключить эту багофичу, что-то типа опции «Сидеть вот здесь и никуда не перепрыгивать, пока хозяин не скажет»?
-
Вот оно как.
-
Вот взять среднестатистического программиста. Какая у него может быть карьерная лестница? Junior, Intermediate, Senior, Team Leader, Head... Не знаю, архитектор там какой-нибудь, не знаю как точно он вписывается в эту иерархию. А какое возможно будущее у верстальщика, кроме как "супердуперверстальщик"? Вот сеньоры в Москве получают 100k, это если смотреть по вакансиям, где размер оклада открыт. Но сеньору есть куда расти. Верстальщик может в Москве получать 90k-100k. Но правда ли, что это потолок? Есть ли куда развиваться дальше?
-
Спасибо, вечером попробую сделать из них Portable-версии.
-
Вот только проблемка в том, что там онлайн-загрузчики, каждый из которых пытается соединиться с сервером Google для скачивания файлов, но в процессе скачивания файлов всегда возникает ошибка загрузки в самом начале процесса. Нормально скачивается только последняя версия. Для тестирования.
-
Здравствуйте. Ни у кого в закромах не осталось старых portable версий Google Chrome? Интересуют версии со 2 по 10 включительно.
-
Так вот где собака зарыта. Спасибо за ответ.
-
В HTML5 тег <menu> вновь включен, но уже в другом качестве. Теперь он выступает контейнером для тега <command> и создания меню.
-
Ну ошибся я в тексте. То есть вместо ul.menu надо юзать menu? А вместо чего надо использовать nav?
-
Я прочитал, что menu используется для размещения меню, а header для размещения навигационных ссылок. А в чём разница-то?
-
И ещё вопрос. Если в src подключаемые файлы перечислены в порядке: EOT, WOFF, TTF, то браузеры с поддержкой WOFF будут загружать только WOFF-файл или все файлы шрифта одновременно?
-
А вот ещё вопрос. У меня в @font-face указана подгрузка EOT и TTF файлов шрифта. Есть ли смысл использовать дополнительно WOFF и SVG файлы шрифтов, если OET и TTF нормально используются браузерами Safari 4+, Chrome 7+, IE6+, Opera 10.5+, Firefox 3.5+?