Selen
-
Posts
82 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by Selen
-
-
Как инициализировать jQuery.Cookie, что бы он автоматически сохранял все изменения на странице ? Включая положение скролла.
В благодарность жителям Украины вышлю бутылку, пиво на выбор - Новой Почтой Жителям других стран - 5 у.е. на Вебмани.
-
-
-
Доброго времени суток.
На локальное машине имеется Apache+PHP+MySQL.
Настроен на локальный просмотр страниц. Работает!
Установил YSlow на Лису. Оценка YSlow указала на моменты которые можно подправить, чтобы увеличить производительность. Подправил!
Осталось 2 момента, с которыми никак не получается разобраться
Add Expires headers - момент связанный с кЕшированием.
Compress components with gzip - сжатие на стороне сервера.
Настройку провожу через .htaccess
Код для gzip:
<IfModule mod_deflate.c>
# force deflate for mangled headers
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
</IfModule>
</IfModule>
# HTML, TXT, CSS, JavaScript, JSON, XML, HTC:
<IfModule filter_module>
FilterDeclare COMPRESS
FilterProvider COMPRESS DEFLATE resp=Content-Type $text/html
FilterProvider COMPRESS DEFLATE resp=Content-Type $text/css
FilterProvider COMPRESS DEFLATE resp=Content-Type $text/plain
FilterProvider COMPRESS DEFLATE resp=Content-Type $text/xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $text/x-component
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/javascript
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/json
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/xhtml+xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/rss+xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/atom+xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/vnd.ms-fontobject
FilterProvider COMPRESS DEFLATE resp=Content-Type $image/svg+xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/x-font-ttf
FilterProvider COMPRESS DEFLATE resp=Content-Type $font/opentype
FilterChain COMPRESS
FilterProtocol COMPRESS DEFLATE change=yes;byteranges=no
</IfModule>
<IfModule !mod_filter.c>
AddOutputFilterByType DEFLATE text/html text/plain text/css application/json
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE text/xml application/xml text/x-component
AddOutputFilterByType DEFLATE application/xhtml+xml application/rss+xml application/atom+xml
AddOutputFilterByType DEFLATE image/svg+xml application/vnd.ms-fontobject application/x-font-ttf font/opentype
</IfModule>
</IfModule>Для Expires headers:
<IfModule mod_expires.c>
ExpiresActive on
# Perhaps better to whitelist expires rules? Perhaps.
ExpiresDefault "access plus 1 month"
# cache.appcache needs re-requests in FF 3.6 (thx Remy ~Introducing HTML5)
ExpiresByType text/cache-manifest "access plus 0 seconds"
# Your document html
ExpiresByType text/html "access plus 0 seconds"
# Data
ExpiresByType text/xml "access plus 0 seconds"
ExpiresByType application/xml "access plus 0 seconds"
ExpiresByType application/json "access plus 0 seconds"
# RSS feed
ExpiresByType application/rss+xml "access plus 1 hour"
# Favicon (cannot be renamed)
ExpiresByType image/x-icon "access plus 1 week"
# Media: images, video, audio
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType video/ogg "access plus 1 month"
ExpiresByType audio/ogg "access plus 1 month"
ExpiresByType video/mp4 "access plus 1 month"
ExpiresByType video/webm "access plus 1 month"
# HTC files (css3pie)
ExpiresByType text/x-component "access plus 1 month"
# Webfonts
ExpiresByType font/truetype "access plus 1 month"
ExpiresByType font/opentype "access plus 1 month"
ExpiresByType application/x-font-woff "access plus 1 month"
ExpiresByType image/svg+xml "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
# CSS and JavaScript
ExpiresByType text/css "access plus 1 week"
ExpiresByType application/javascript "access plus 1 week"
ExpiresByType text/javascript "access plus 1 week"
<IfModule mod_headers.c>
Header append Cache-Control "public"
</IfModule>
</IfModule>Просьба не отправлять на гугл и другие поисковики! Был, искал, читал. Пишут везде одно и тоже, то что я и сделал.
Apache имеет дефалтные настройки.
YSlow не умолим. Add Expires headers и Compress components with gzip - в красной зоне. F и E соответственно.
Буду признателен за помощь!
-
Так никто и не разобрался в этом странном баге Opera ?
-
да код-то вы увидите, но толку от него. Я вам и на "пальцах" все рассказать смогу.
Есть основной блок header, к нему с помощью позиционирования цепляем псевдоэлемент, в самом ПЭ ставим фон. В итоге ваш кусок фона будет находиться в определенном месте. Всегда.
Попробовал данное решение. С кодом можно ознакомиться здесь http://jsfiddle.net/9zJyy/
Получилось. Но есть два нюанса:
1. Появилась горизонтальная полоса прокрутки. На размер рисунка.
2. При добавлении контента в хедер, кусок фона смещается вниз. В зависимости от количества контента. + Растет высота хедера.
Вторую проблему решил: указанием фиксированной высоты. А смещение вниз - отрицательным значением значения top. А вот как с первой проблемой бороться ?
psywalker А разве при уменьшении окна рука не заедет под основной блок. Ты ведь предлагаешь ее (руку) сделать бекграундом ?
-
Я могу увидеть фрагмент кода ?
-
Добрый вечер. Во время верстки учебного макета, столкнулся с трудностью.
Имеется фиксированный блок. Отцентрированный (margin: 0 auto;). Размер блока 900px;
Все бы ничего. Но справа, к шапке тянется рука, держит визитку.
Размер руки за пределами блока 270px;
С самой версткой вопросов нет. Но вот как можно прикрутить руку, что бы основной блок оставался в центре, при любом разрешении и рука прилегала к правому краю. И была видна в зависимости от разрешения.
Готового решения не смог найти. А моих знаний не достаточно для реализации.
Есть идеи ?
-
Для DIV в стилях прописываешь margin: 0 auto. Отцентрируешь блок, а с ним и его содержимое.
-
За основу взята стандартная заготовка, фикс размера, с прижатым к низу футером. Все лишнее, включая футер я убрал. Оставил сам каркас и тень. Внизу страницы имеется дыра, размером с тень. Этот отступ наблюдается только в Опера.
-
В данном решении есть небольшой нюанс.
Если ты делаешь ссылку блочным элементом. То она, приобретает свойства блочного элемента.
В частности, ширина блочного элемента равна ширине его родителя. Это момент стоит учитывать. Иначе, при наведении на пустое место, рядом со ссылкой. Курсор будет реагировать формой пальца, как при наведении на ссылку. И переходить по ней.
Тогда лучше воспользоваться display: block + float: right.
-
Присоединяюсь к вопросу.
-
Всем добрый день, я столкнулась с такой проблеммой при вёрстки печатной версии сайта.
Как сделать так чтоб логотип, при печати сайта, расспологался в левом нижнем углу каждой странички?
Спасибо
Я бы поступил следующим образом:
1. Подключил бы внешнюю таблицу стилей, ориентированную на печать:
<link rel="stylesheet" type="text/css" href="css/print.css" media="print" />
2. При печати, элементы с фиксированным позиционированием отображаются на каждой страницы (как колонтитул):
DIV#logo {position: fixed; top: 90%; left: 20px;}
-
Или может имелось ввиду это ? http://htmlbook.ru/layout/sloy-po-tsentru-veb-stranitsy
-
А еще, в конце основного блока (у тебя это wrapper) не мешало бы добавить пустой блок (распорку) с заданной высотой. Иначе футер, при уменьшении окна, будет наезжать на основной контент.
-
Selen
У каждого свой подход. То, что ты описал, это ничтожно мало на мой взгляд. Капля в море. Вот мой план МИНИМУМ только на HTML/CSS
http://forum.htmlbook.ru/index.php?showtopic=25566&view=findpost&p=191420
Ничтожно мало для чего ? Для того, что бы стать профессиональным верстальщиком ? Да. Разумеется. Этой информации не достаточно. Но, сориентировать человека, и направить его в нужное русло - вполне хватит. Тема не исчерпана. Но думается мне, к концу обсуждения этой темы, Новичок, будет вооружен до зубов информацией и соответствующей литературой. И кто знает, может тема даже попадет в категорию ВАЖНО, этого раздела
Gaspode Уайк-Сми и Ши обязательно почитаем.
Great Rash Эдакая учеба через работу ?! Тоже вариант. Именно на практике познается истинна.
buddah Получать наслаждение от работы ?! Ну, как же без этого ! Именно о работе, приносящей удовольствие мечтает каждый человек. PS: Не путать с самой древней профессией))))
psywalker Спасибо за ссылку. Я ее читал. Именно она и побудила меня написать что то от себя
-
-
-
Практически каждый человек, пожелавший посвятить свою жизнь Веб разработке, и попавший на этот форум. Создает тему со следующими словами: "Как начать ?", "С чего лучше начать изучение верстки: CSS или JavaScript или HTML? А может быть с PHP?" и т.п. В этом ничего зазорного нет ! Все мы когда то были новичками, в том или ином деле.
Но, на мой скромный взгляд, однотипные темы (только названные по разному). Не только засоряют форум, но и затрудняют поиск, действительно, полезной информации. Искатель, поставивший себе за цель найти информацию о PNG прозрачности в IE6, попросту ее не найдет (хотя она есть). Ему не остается ничего другого, как продолжить создавать дублирующие темы, еще более загрязняя форум
Надеюсь, ниже написанная статья, поможет новичкам выбрать правильный курс своего обучения.
Статья не претендует на истину в последней инстанции. Но лично мне бы не помешала такого рода информация, в начале моего изучения.
Итак. Приступим...
Если собираешься связать свою жизнь с Веб-разработкой, начинай читать и вникать во все ее аспекты. Быть всегда в теме (и не только Веба), тебе поможет Хабр. Следи на развитием веб-стандартов, тенденцией развития основных веб-браузеров, изучай инструменты улучшающие/ускоряющие разработку. Читай, даже если не все понятно, все что касается HTML, CSS, JavaScript, CMS, хостинга и т.д. Могу посоветовать два очень информативных профильных ресурса: htmlbook.ru и xiper.net, одни из самых лучших на мой взгляд.
Что касается последовательности изучения. Их можно разбить на следующие этапы:
1. HTML. Сразу начинай учить Строгий (Strict) 4.01 + работающие теги из HTML 5. Отсутствие переходных тегов и атрибутов, плавно подтолкнет тебя к изучению CSS.
2. CSS. Начни с учебника htmlbook.ru. Получив основные понятия прочитай книгу "CSS. Каскадные таблицы стилей. Подробное руководство (3-е издание)", автор Эрик А. Мейер.
3. JavaScript. После того как хорошо разберешься со связкой HTML+СSS. Начнешь применять их на практике. И после того как средств HTML+СSS тебе станет недостаточно, для реализации своих задумок. Ты начнешь изучать JavaScript. В начале ты будешь подключать готовые решения (скрипты) к своим страничкам. А в последствии, покопавшись и разобравшись в чужих скриптах, начнешь "писать" свои. Литература: "JavaScript. Подробное руководство (5-е издание)" Дэвид Флэнаган. Ресурс: javascript.ru
Верстальщика хорошо знающего HTML+СSS+JavaScript, пожелает видеть в своей команде каждая уважающая себя веб-студия.
Что касается PHP. Этот язык программирования, в отличии от JavaScript - предназначенного обрабатывать информации на стороне клиента (браузера), предназначен для обработки информации на стороне сервера. PHP лучше изучать в связке с базами данных (SQL), с различными приставками My, Postgre и т.д.
Вместо заключения.
Итак. Если ты умеешь использовать HTML+СSS+JavaScript. И у тебя есть друг, знающий PHP+MySQL. А второй друг виртуоз Photoshop'а, с дизайнерскими способностями. То это уже небольшая команда, способная выполнять небольшие проекты. Хотя, сюда можно добавить еще одного персонажа. PM - он же Проджект Манагер. Который будет курировать разработкой.
Ну, что же. Краткий мануал "В каком направлении копать!?", у тебя есть. Все в твоих руках. Дерзай
PS: Уверен, более опытные верстальщики смогут дополнить эту статью, кое-что подправить. К тому же, это моя первая статья поучительного плана. Да и не хабраюзер я. В общем, не судите слишком строго
-
нифига школота борзая
1. в этом учебнике есть все, что ты описал. после его прочтения будет база, на которую можно набивать опыт верстки. хочешь изучать хтмл - флаг тебе в руки. но для верстки нужно знать css.
2. больше наглым и тупорылым (ты даже не удосужился изучить ссылки, что я те дал) школьникам не даю советов
Selen, для чего придумали css
Ну и ? Что ты хотел хотел сказать, дав ссылку на эту статью ? Я это и так знал.
-
Может сразу мне приступить к изучению css?
Ничего другого Вам не остается. Сверстать страницу на чистом HTML без CSS - дорогого стоит По крайней мере по затраченному времени Тут главное начать изучение с правильной литературы или метод. материала. HTMLBOOK.RU - идеально для этого подходит. В использование CSS нет ничего сложного, главное разобраться в теории и применить полученные знания на практике.
-
Ну я не знаю как вам, но мне он больше нравиться чем notepad++. Хотя у каждого из них есть свои плюсы
А у notepad++ их целых два Игра слов...
-
Задачка для общего развития. С увеличением кол-ва широкоформатных мониторов - может пригодиться.
-
Как можно сделать из нее 4-х колоночный. 1 и 4 фикс. 2-3 резина.
Поделить среднюю колонку пополам.
Следуя совету. Попробовал сделать так:
<article>
<div class="col1">
2_Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World
</div>
<div class="col2">
2_Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World
</div>
</article>DIV.col1 {
float: left;
width: 50%;
}Я все правильно понял ?
jQuery.Cookie
in JavaScript
Posted
Спасибо всем за участие Тему можно закрывать, решение найдено !