Crystal-3
-
Posts
86 -
Joined
-
Last visited
-
Days Won
2
Content Type
Profiles
Forums
Calendar
Store
Posts posted by Crystal-3
-
-
Может так вам надо? (document.body.clientHeight - 100) * 0.9 + 'px';
Спасибо Вам за отклик, но увы...
Реакция как бы есть, но совсем не то что нужно: картинка стала совсем маленькой и вообще не реагирует на изменения высоты браузера.
Если добавляю в свой предыдущий код
document.getElementById("rockImg").style.height = document.body.clientHeight+"px";
вообще кошмар - картинка (а это такой серый камушек) постоянно увеличивается, независимо уменьшают или увеличивают высоту браузера. В итоге этот камень вырастает до громадных размеров.
Видимо у меня совсем кривые руки.
Ну а книгу однозначно в топку, вместо того чтобы научить, она меня только запутала, даже пропало желание изучать JS.
-
Я поняла объяснение SelenIT, спасибо ему большое.
Николя223, именно так я и начинала исправления: отнимаю 100рх и умножаю на 90%.
Один из вариантов, а их было много, так как не уверена в синтаксисе:
document.getElementById("rockImg").style.height = (document.body.clientHeight - "100px") * "90%";
Не работает.
В итоге я упростила код, чтоб не было вообще единиц измерения, но и он нерабочий, вернее работает, но без доктайпа.
-
Ребята, это какой-то замкнутый круг!
Пытаюсь исправить этот код, упростила до минимума, здесь нет вообще единиц измерения:
<!doctype html><html> <head> <meta charset="UTF-8"> <title>iRock</title> <script type="text/javascript"> function resizeRock() { document.getElementById("rockImg").style.height = document.body.clientHeight; } </script> </head> <body onload="resizeRock();" onresize="resizeRock();"> <div> <img id="rockImg" src="rock.png" alt="iRock"> </div> </body></html>Высота картинки должна подстраиватся под высоту клиентского окна.
Но нет, опять работает только без доктайпа.
Ох, уж этот JS...
-
Ivan-P, знаю эту книгу. Так вот почему я не смогла осилить это задание) А в их примере доктайпа нет.
SelenIt, я все же не могу понять, почему не работает с доктайпом? Мне ж теперь тоже интересно, я столько времени потратила, пытаясь найти причину, а оно вот что оказывается)
-
SelenIT, спасибо большое, сейчас попробую исправить)
-
подскажите как в отладчике хрома посмотреть схлопнут ли блок?
«Схлопнутый» блок, имеет нулевую высоту ( если ему не задан padding, margin и/или border). Он не видит плавающих блоков и соответственно не тянется за контентом.
В отладчике такой блок или не видно вообще, или только его отступы и поля.
На второй вопрос вам уже ответили.
-
Было интересно посмотреть вашу вёрстку, так как у меня тоже опыт где-то месяцев 6-7.
Код мне ваш понравился и, в общем-то, покритиковать не нашла что.
Разве что несколько советов:
У доктайпа HTML5 кодировка пишется <meta charset="UTF-8">.
Сердечко сделайте тоже спрайтом.
Зачем подключена библиотека jQuery?
-
на ширину пункта меню не реагирует , white-space тоже
Да ладно… Почему тогда у меня реагирует?
Пропишите в CSS:
.image-title { white-space: nowrap;}И да, ширину нужно добавить.
-
Общее впечатление – хорошо.
А по поводу ошибок, вот как я это вижу:
1.Если указываете доктайп HTML5, то и кодировку пишите <meta charset="UTF-8">.
2.Зачем подключать шрифт 'Oswald', если он нигде не используется?
3.Вы много где прописываете margin:0, padding:0. А может сразу сделать сброс стилей?
4.В блоке social кнопки нужно сделать спрайтами. Когда наводишь на них первый раз, одна пропадает, вторая ещё не успевает подгрузится.
5.В header вообще не сделана очистка плавающих элементов, везде «схлопнутые» блоки, спасает только то, что кругом указана высота.
А вообще, перечитайте про очистку, мне показалось, что вы не совсем понимаете как это делать.
В content проскакивает clear, но он как-то не в тему.
6.В сайдбаре, где блок navigation для ссылки укажите высоту, потому что когда наводишь на «Войти в раздел» видно начало второй кнопки.
-
Вот насчет спрайтов не совсем понял
Пропишите картинку бэкграундом не для <div>, а для < а>. a:hover оставте так как есть. И пересмотрите высоту < а> и при a:hover, она должна быть одинакова. (< а> задайте display:block)
Сейчас при наведении картинка немного подпрыгивает, возможно из-за этого.
У меня тоже ссылка не работает.
Странно, у меня работает во всех браузерах, кроме Хрома. Даже в ИЕ8.
-
Мне нравится ваш код) Чистенько и аккуратно.
-
В целом неплохо, но есть ошибки.
1. Заголовок h3. Не нужно задавать width, сделайте display: inline-block и выровняйте padding.
2. Спрайты. Сначала вы цепляете картинку на <div>, при наведении уже на < а>. Это нужно исправить.
3. Footer. Сделать очистку обтекания. Блокам .about_f и .twitter_f не нужно так жёстко задавать высоту.И да, кстати, в Хроме страничка не открывается, выдаёт ошибку.
-
Попробуйте прописать в css:
.view-content { float: left;} -
1. В Оpera sidebar вылез на content.
2. Не забывайте про очистку плавающих элементов. В menu и tags есть «схлопнутые» блоки.
3. В menu кликабельна только надпись, а не вся кнопка.
-
Здравствуйте.
Очень хочу услышать критику моего кода, а также нужна помощь с header’ом.
Начну по порядку. Первый раз работаю с таким количеством скриптов, у меня здесь много слайдеров, sticky header. Ну и мой дебют – popup окошко.
И вот именно с header’ом у меня возникли трудности , ну никак не могу понять его поведение. Я устала с ним бороться в одиночку и прошу помощи у вас.
Мне нужно, чтобы при клике на один из пунктов меню header плавно опускался к якорю, при этом присваивается класс актив.
У меня же творится какое-то безобразие, при первом клике header почему-то опускается ниже якоря и не срабатывает класс актив. При повторном клике всё начинает работать так, как надо. Как можно это исправить?
Ссылка на страничку: http://exumple3.esy.es/
Заранее спасибо за критику и за помощь.
-
Конечно стоит, ведь пользователь идёт на страничку за контентом.
Советую почитать по этому поводу Бен Фрейн "HTML5 и CSS3. Разработка сайтов для любых браузеров и устройств".
-
Спасибо всем большое)
Теперь я поняла в какую сторону мне двигаться дальше.
-
Ребята, ещё нашла вот такую информацию, хочу услышать ваше мнение.
Хорошей новостью является то, что если ваше письмо сверстано хорошо для этих трех почтовых клиентов (Google Mail, Lotus Notes и Outlook 2007), то оно будет хорошо отображаться почти во всех остальных почтовых клиентах, если не во всех.
На практике насколько это отвечает действительности?
-
Ребята, спасибо вам за советы.
Про Оутлук поняла, а вот про ИЕ6 можно подробнее?
-
Здравствуйте.
Сверстала HTML-письмо.
Как проверить корректность его отображения в различных почтовых клиентах? Устанавливать себе на комп самые популярные? Но их же около 13-ти.
В сети есть сервисы тестирования, но все платные.
Поделитесь опытом, как вы тестируете письма?
-
dimadyak, я тоже верстала этот макет и вырезала всю картинку целиком (небоскрёб с облаками), на случай если заказчику захочется немного опустить блок с контентом то будут видны облака, а не пустота.
Хочу вставить картинку png, но не могу найти как это сделать.
-
WEB-best, спасибо, буду знать.
-
Общее впечатление - неплохо, но мне не понравилось как вы вырезали картинку с небоскрёбом.
И ещё есть пару вопросов.
Зачем вы подключаете шрифт "trebuchet_ms" ? Это же стандартный шрифт.
И вот что это?
.sidebar, .main { margin-bottom: -32000px; padding-bottom: 32000px;} -
Это вы о чем?
JS и DOCTYPE
in JavaScript
Posted
Супер, работает! Ну наконец-то мой камень-неадекват сдался
SelenIT, спасибо огромное за такое подробное объяснение, без Вашей помощи я бы никогда не справилась.
Вот и учись после этого по таким учебникам)
Специально для ТС (может ещё заглянет) рабочий вариант кода:
function resizeRock() { document.getElementById("rockImg").style.height = (document.documentElement.clientHeight - 100) * 0.9 + 'px'; }