Jump to content

skatadov

User
 View Profile  See their activity

  • Posts

    43

  • Joined

  • Last visited

  • Days Won

    1

 Content Type 

Everything posted by skatadov

  1. skatadov
    Попробуйте задать maneBg_2.jpg фоном для html, а из body эту картинку убрать
  2. skatadov
    Попробуйте еще в embed добавить wmode="transparent" Но и <param name="wmode" value="transparent" /> убирать не надо. Что выйдет? Выложите ссылку на рабочую страницу, а то ссылки в теме битые.
  3. skatadov
    Попробуйте такой вариант, только Jquery подключить не забудьте. $(function() { $('.block li a').click(function(event) { $(this).parent().toggleClass('open'); }); }); .block div{ display: none; } .block .open div{ display: block; } <ul class="block"> <li><a>Заголовок 1</a> <div>Скрытый текст 1</div> </li> <li class="open"><a>Заголовок 2</a> <div>Скрытый текст 2</div> </li> </ul>
  4. skatadov
    Я бы объединил этот блок с футером.
  5. skatadov

    :hover

    skatadov replied to artem42's question in HTML Coding

    a { color: blue; } ul:hover a{ color: green; } ul:hover a:hover{ color: blue; } <ul> <li><a href="">Пункт</a></li> <li><a href="">Пункт</a></li> <li><a href="">Пункт</a></li> <li><a href="">Пункт</a></li> </ul>
  6. skatadov
    Похоже, то что надо. Спасибо.
  7. skatadov
    Вот-вот... Но хотелось бы найти способ без переназначений.
  8. skatadov
    Прикрепил к первому сообщению картинку, где схематично набросал макет. Черное по бокам - поля. Синее - контентный блок.
  9. skatadov
    Возникла задача сделать следующее. Резиновый макет. Минималка 1000px. Максималка - не ограничена. Необходимо каким-то образом по бокам контентного блока (синий) сделать поля по 50px (черные), которые при ширине окна 1000 будут обрезаться - прятаться за пределами экрана. Это необходимо для того, чтобы убрать горизонтальную прокрутку при разрешении 1024. При увеличении ширины окна поля должны вылезать из-за его границ до общей ширины 1100px, затем уже должна начать тянуться контентная часть. Единственное, до чего пока додумался - это через link ... media="screen and..." подключать еще одну таблицу стилей для большой ширины, но этот вариант решения не устраивает из-за резких скачков при изменении размеров окна. Какие еще есть варианты решения?
  10. skatadov
    У меня Опера 9.63 и 11.01 - срабатывает только после клика по флешке. swfobject.js - Спасибо, попробую.
  11. skatadov
    При наведении на flash (меню из пяти пунктов в центре, каждый пункт - отдельная флешка) должен появляться визуальный эффект. Во всех браузерах срабатывает корректно, а в Опере только после клика по flash. Подскажите, в чем проблема? http://skatadov.ru/test/001/
  12. skatadov
    Благодарю =) Вы развеяли мои последние сомнения по данному вопросу.
  13. skatadov
    Возникла необходимость сверстать следующий элемент: Текст "утоплен" в фон. Можно ли добиться такого эффекта отображения текста без использования графики, или придется делать пункты картинками?
  14. skatadov
    Лично я бы их просто маргин-топами вниз спихнул до нужного уровня, и все.
  15. skatadov
    Всем спасибо за ответы. Нее, автор ни на вас не забил, ни проблемы не решил ) Несмотря на то, что заказчик уже принял работу, так как пребывает в уверенности, что это технически нереализуемо, у меня тоже появился спортивный интерес в решении данной задачки ) Найти бы еще время... Zippovich, тоже думаю о таком решении. В принципе, рабочая реализация резина|фикс|резина мне известна, теперь думаю над тем, как все это дело корректно растянуть по высоте.
  16. skatadov
    Возникла необходимость сверстать вот такой вот шаблон. Контентный блок(серые прямоугольники на белом фоне) фиксированной ширины, и расположен по центру. На первый взгляд, все просто, если бы не одно НО. Вертикально расположенный пунктир по бокам (на сером фоне). Вне зависимости от ширины свободного места вокруг контентной части пунктирная линия должна идти по центру этого свободного пространства. Единственное решение, которое мне на ум пришло, приведено ниже. Но увы, оно не подходит - нужно сделать пунктир графикой - dashed-ы имеют существенно меньшую длину, чем черточки в PSD. А вот как сделать с графическим пуктиром выполняя все поставленные условия, я додуматься не могу... <!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> <title></title> <meta name="description" content="" /> <meta name="keywords" content="" /> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <!--[if IE 6]><script type="text/javascript" src="minmax.js"></script><![endif]--> <style type="text/css"> * { margin: 0; padding: 0; } html { height: 100%; width: 100%; background: #9CA7B0; } body { position: relative; min-height: 100%; margin: 0 5%; border-left: 3px dashed #fff; border-right: 3px dashed #fff; padding: 0 5%; min-width: 994px; max-width: 1280px; } #content { position: relative; } #content_1{ background: #c0ddff; width: 994px; margin: 0 auto; } #fg { height: 100px; background: black; clear: both; } #footer { position: absolute; bottom: 0; width: 988px; height: 100px; background: brown; } </style> </head> <body> <div id="content"> <div id="content_1"> home<br />content<br />end </div> </div> <div id="fg"></div> <div id="footer"></div> </body> </html>
  17. skatadov
    <!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> <title></title> <meta name="description" content="" /> <meta name="keywords" content="" /> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <style type="text/css"> * { margin: 0; padding: 0; } #d3 { width: 300px; } #d3 img { border: none; float: left; height: 75px; width: 100px; } </style> </head> <body> <div id="d3"> <a href=""><img src="1.jpg" alt="" /></a> <a href=""><img src="1.jpg" alt="" /></a> <a href=""><img src="1.jpg" alt="" /></a> <a href=""><img src="1.jpg" alt="" /></a> <a href=""><img src="1.jpg" alt="" /></a> <a href=""><img src="1.jpg" alt="" /></a> <a href=""><img src="1.jpg" alt="" /></a> <a href=""><img src="1.jpg" alt="" /></a> <a href=""><img src="1.jpg" alt="" /></a> </div> </body> </html>
  18. skatadov
    Возникла необходимость сделать шаблон, отвечающий следующим условиям: а. Три колонки. б. Боковые колонки - фиксированной ширины, центральная тянется. в. Высота всех колонок визуально одинакова, и тянется от низа header`а до верха пристыковнного к низу экрана footer`а. г. Шаблон должен тянуться по ширине от 600 до 800 пикселей. д. При высоком разрешении шаблон должен располагаться по центру окна, а не пристыковываться к левой его стороне. Пункты "а", "б", "г" никаких проблем не вызывают. Для решения задачи, описанной в пункте "в", решил попробовать воспользоваться методом ложных колонок. Для background`ов создал два изображения - orange_200 шириной 200px - для создания левой колонки и grey_800 шириной 800px - для создания правой колонки, в grey_800 первые 600 px картинки прозрачны, оставшиеся 200 - серая заливка. Итак, левую колонку делаю путем замощения html: background: url(orange_200.gif) repeat-y; Правую - путем замощения body: background: url(grey_800.gif) repeat-y 100% 0; Ура. Выходит, центральная колонка тянется, замощения боковых никуда не деваются. Но тут возникает проблема: пункт "д". Сейчас-то шаблон пристыковывается к левой границе окна. Соответственно, чтобы расположить его по центру, задаю для body margin`ы: margin: 0 auto 0 auto; Но в этом случае orange_200 остается пристыкованной к левой границе экрана, соответственно, колонка уползает при увеличении ширины окна, что, впрочем, вполне ожидаемо: html-то тянется по ширине на всю область экрана браузера. Что делать? Елинственное, что мне пришло на ум, это перенести min-width, max-width и margin: 0 auto 0 auto от body к html. В нормальных браузерах после такого действия все отлично, соблюдены все условия. Ну, а IE6 теперь не рассчитывает минимальную и максимальную ширину, шаблон тянется на весь экран. Что делать? <!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> <title></title> <meta name="description" content="" /> <meta name="keywords" content="" /> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <!--[if IE 6]><script type="text/javascript" src="minmax.js"></script><![endif]--> <style type="text/css"> * { margin: 0; padding: 0; } html { height: 100%; min-width: 600px; max-width: 800px; margin: 0 auto 0 auto; background: white url(orange_200.gif) repeat-y; } body { position: relative; min-height: 100%; background: url(grey_800.gif) repeat-y 100% 0; } #header { height: 100px; background: #c0d0f1; } #outer { float: left; width: 100%; margin-right: -200px; } #menu { width: 200px; float: left; background: yellow; padding-bottom: 110px; } #bt { padding: 0 200px 110px 200px; } #d3 { float: left; background: #ccc; width: 200px; padding-bottom: 110px; } #fg { visibility: hidden; clear: both; } #footer { position: absolute; height: 100px; background: blue; bottom: 0; width: 100%; } </style> </head> <body> <div id="header">header</div> <div id="outer"> <div id="menu">menu</div> <div id="bt">bt</div> </div> <div id="d3">d3</div> <hr id="fg" /> <div id="footer">footer</div> </body> </html>
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept