Фиксированное меню для всех браузеров II

[Трубчатый Кот]

Способ больше не работает.

Читать тут: http://pay.diary.ru/~diaryCSS/?comm...postid=29862611



После незначительных изменений основных дайри-стилей перестал работать предыдущий способ

Новый способ (чуть проще и короче)



html { background: transparent !important; background-attachment:fixed; background:url('/userdir/9/3/1/2/93120/17895735.gif') ; }

#side div.bordered{position:fixed !important; display: block; z-index: 3; zoom:1; position: absolute; top: 10px; left: 10px; top: exprеssion(parseInt(document.documentElement.scrollTop, 10) + "px");}



/userdir/9/3/1/2/93120/17895735.gif заменить на любую картинку из Библиотеки Изображений. Идеальный вариант - полностью прозрачная картинка 10 на 10px

#side div.bordered можно менять на идентификаторы отдельных блоков меню



Позиционируется меню следующим образом:

#side div.bordered{position:fixed !important; display: block; z-index: 3; zoom:1; position: absolute; top: Ypx; left: Xpx; top: exprеssion(parseInt(document.documentElement.scrollTop, 10) + Y + "px");}

X и Y - целочисленные координаты меню



замечание 1 обязательно после сохранения проверьте тот ли код вставился (важно, чтобы не потерялись слова exprеssion и parseInt)

У меня нормально вставилось в том виде, в котором оно здесь записано, но могут быть глюки.

замечание 2 десять раз продумайте высоту меню - так чтобы оно влазило полностью. помните, что у посетителей вашей страницы будут появляться дополнительные блоки.



Тестировалось в IE6, Опера 9.2

Если несложно, протестируйте на других браузерах и расскажите. Особо интересует поведение IE7

@темы: меню

---

[Sunny dancer]

Всем привет!)Я новичок,поэтому не судите строго!У меня вопрос:"Как сделать так,чтобы при наведении на ссылку,она подчёркивалась линией сверху и снизу(как бы рамочка)??

---

Текст в extratop

[-Kenji-]

Собственно, сабж...

Существует ли какая-то возможность добавить в #extratop текст?



поиск по сообществу ничего про текст не выдал, поэтому приходится беспокоить.

@темы: текст, diaryCSS

---

[Lemonina]

Если долго мучаться...

В общем получилось или нет - судите сами.

Что нить съезжает?

Советуйте ^^

---

| меню и прочее,

[C.Rabbit]

не работает position: fixed у блока меню и не получается сделать так, чтобы записи "заезжали" под экстратоп.(

это так надо или я тупой? *)



и ещё хотелось бы узнать, как изменить ширину поля для ввода пароля (когда пишешь коммент)?)

а то из-за него меню сьезжает вниз.)

@темы: меню, основные блоки

---

[THE GODDAMN HERO!]

здрассти, я тупой. ^^"

как можно влепить картинку, или хотя бы цвет в то поле, куда вводится комментарий... то самое, беленькое, над которым еще кнопочки? и гамму самих кнопочек неплохо было бы изменить... ^^""

мне говорили, что где-то это было, нэ? но я не нашол... >_>"

@темы: фоновые картинки

---

[немного мальчиков]

можете высказать все,что думаете о моем дневе)

xD

---

оцените диз

[crimsongrass]

прошу оценить диз

я знаю, что я не оригинальна, но все же хочу услышать отзывы

может что-то изменить или добавить?

---

[toryk@]

слушайте в я дневах недавно...еще не очнь разобрался...как добавить человека в ПЧ?

---

темы

[крокер]

как сделать "@тема:...."

не курсивом, жирной и другим размером?

---

[badmorning]

Добрый вечер, у меня опять проблема.

До недавнего времени я была весьма довольна своим дизайном. Наблюдала его через Оперу.

А тут решила вдруг посмотреть, что с ним творится в ИЕ.

И обнаружила весьма неприятные вещи:



1. Иконку-собачку изменила при помощи кода

.TagJIco { background:url('/userdir/2/5/2/2/252297/19045555.gif') no-repeat 0%; position:relative; padding-left:16px;}

background:url('/userdir/2/5/2/2/252297/19045555.gif')

Вышло вот что:

клик

Нормальная картинка только рядом с последним ником.



2. Вторая проблема - опять же с аватарами.

Использую код для создания подсветки аватаров и тени под ними, тот что доктор прописал тот что Рёцке подсказал.

В ИЕ аватары живут своей жизнью, наезжают друг на друга, на ники, уезжают вниз, словом - ведут себя из рук вон плохо.

К примеру, это выглядит так:

еще раз клик

Помогите избавиться от всего этого безобразия, пожалуйста.

---

темы

[крокер]

Как вынести в эпиграф основные темы ссылками?

@темы: эпиграф

---

Ссылки

[мечта идиота]

Простите, если было. Уже в сообществе накопилось так много вопросов-ответов, что сложно за всем уследить и найти то, что нужно.



Как сделать так, чтобы при наведении на ссылку, шрифт делался жирным?

@темы: меню

---

Прокрутка.

[[chemical_freak]]

Здравствуйте!

У меня такой вопрос:

можно ли при закреплённом меню сделать прокручивающимися его "оторванные" части, разделить блок на несколько колонок, или хотя бы сделать скроллбар?

Собственно проблема такая:

у меня закреплено меню, отделён блок #thisDiaryOwner. При этом отделён исключительно по той причине, что все темыне умещаются на экране и меню обрезается. После отделения этого блока проблема осталась, а уж очень хочется, чтобы было видно все темы.

Заранее огромное спасибо.

@темы: меню

---

[velour.@]

следующая проблема: сделала первую букву каждого поста большой и другой цвета

использовала код:

.paragraph div:first-letter { font-size: 22px; float: left !important; float: none; font-family:Comic Sans MS; margin-right: 2px; color: #996699; line-height:100% !important; line-height:140%; }

теперь вторая строка поста съезжает немного вправо

изза чего?

@темы: текст

---

[god save cocaine]

Я недавно начала использовать css, посмотрите, пожалуйста, может что-нибудь подправить нужно? мой дневник

вот если что много моих кодов

#side{position:fixed}

#side{font-family:Garamond,"Comic Sans MS"; }

.offtop {font-family:Garamond,"Comic Sans MS"; }

#postsArea, #commentsArea {font-family:Garamond,"Comic Sans MS"; }

#side{position:fixed}

body{ background-attachment:fixed; }

#pchs { float:left; visibility:hidden; }

#pchs a { float:left; clear:both; width:100%; */ visibility:visible; }

bordered {border-style:groove;}

. .borderTop{border-style:groove;}

.singlePost,.menuSection,.borderTop { border-color:#ffffff;}

.singlePost#epigraph a { text-decoration:underline; }

.singlePost#epigraph a:hover { text-decoration:none; }

.singlePost#GroupOp { border-style:solid; border-width:2px 0 0; background-color:#ffffff; padding:5px 0 0 0; text-align: right; color:#ffcc66; margin-top: 10px; }

h2,.header { color:#ffcc66; font-size:118%; font-style: normal;font-weight: normal;; }

.header a { color:#ffcc66; }

a { color:#33cc66; }

.cbegun { color:#00cc33; font-weight:normal; font-size:92%; }

.cbegun:hover { text-decoration:underline; }

.offtop { color:#ffcc33; }

.calnd td.cal-head { background-color:#99cc00; color:#99cc33; font-style: normal;font-weight: normal; text-align:center; }

.calnd td.cal-mnth { font-style: normal;font-weight: normal;; text-align:center; color:#66ccff; }

.forCheck { float:right; }

.header.calHeader { text-align: left;}

#content { padding: 0px;font-size:13px;background-color:#99cc33;margin-bottom:1 }

.bordered { background:#ffffff; border-color:#ffffff;}

.postLinksBackg {background-color:#99ccff; font-size:83%; padding: 5px;}

.pollLine { background-color:#ff6699; height: 1px; padding:0px; }

.favTagsColor { color:#000; border: none; }

#but {font-size: 86%;}

.TagL {color:#ff6633;}

.TagJIco { background: no-repeat 0%; position:relative; padding-left:16px;}

a:hover{cursor: help;}

a:link {text-decoration: none !important;}

a:hover {color: #ffcc00; background:; text-decoration: none;}

a:visited {text-decoration: none !important;}

a:active {background:#ffffff; text-decoration: none !important;}

#wrapper #postsArea, #commentsArea, #addCommentArea, #side, #wrapper .bordered{line-height:1.1;display:block;-moz-border-radius:0.8em;}

#side{font-family: ; }

#postsArea{font-family: ; }

#commentsArea {font-family: ; }

.TagJIco { background: no-repeat 0%; position:relative; padding-left:16px;}

body{ background-attachment:fixed; }

body.left{padding-left:10px !important;}

.left #wrapper{width:650px;margin: 0 0 0 -325px !important;padding:0 !important;position:relative;left:51%;//left:49.5%;overflow:hidden;}

.left #side{width:140px !important;margin:0 !important;}

.left #page-c{width:500px !important;padding:0 !important;}

body{ background-attachment:fixed; }

#extratop {background: no-repeat; padding-top: 20px !important; background-position:50% 100%}

.left #wrapper{background:#ffffff;overflow:hidden;}

em, .atMusic { text-transform: lowercase;font-size: 9px}

em, .atMood{ text-transform: lowercase;}

em { font-style: normal; }

.header {text-alight: center; }

#myDiaryLink a{color: }

#allDiaryLink a{color: }

div.menuSection, div.pageBar, .calnd { background: ; border-width:1px; border-color:#66ccff; border-style:double; padding:7px;}

h2,.header { text-align:center;}

type="text/" var postW=100; function setSImg(img){ if(img.widthpostW) img.parentNode.className="img_div"; }

function setPostW(obj) { if(postW==100) postW=obj.width; obj.display='none'; obj.visibility='hidden'; }

function swap(num) { var obj=document.getElementById("re"+num); if (obj.visibility=='visible') { obj.display='none'; obj.visibility='hidden'; }

else { obj.display='block'; obj.visibility='visible'; }

}

function ChangeRecordCoutn(value) { var obj=document.getElementById('record_num'); if(value) obj.innerHTML=Number(obj.innerHTML)+1; else obj.innerHTML=Number(obj.innerHTML)-1; }

document.write(""+ " src=//www.diary.ru/statistic/statistic.php?uid=425669... "&rnd="+ Math.random()+ "\/"+ ""); //head body id="JournalComments" class="left" !--[if IE 7] type="text/css".header {position:relative; }

![endif]-- div id="wrapper" div id="extratop"span/span/div div id="page-c" div id="page-t" div class="bordered" id="postsArea" body.left { padding-left: 10px !important; padding-left: 220px; }

body.left { padding-left: 10px !important; padding-left: 250px; }

.left #wrapper { margin:0 !important; margin-left:-240px; padding-left:240px; }

.left #side { width:230px; margin-left:-240px !important; margin-left:-120px; margin-right:-230px; }

.right #page-t { margin-right:240px; }

.right #side { width:230px; margin-left:-230px; }

#side{overflow:hidden}

body.left{padding-left:10px !important;}

.left #wrapper{width:800px;margin: 0 0 0 -390px !important;padding:0 !important;position:relative;left:50%;//left:49.5%;}

.left #side{width:170px !important;margin:0 !important;}

.left #page-c{width:600px !important;padding:0 !important;}

#postTitle {width: 200px }

a:link,a:visited{text-decoration:none !important;}

a:hover,a:active{border-bottom:1px dotted #592e10 !important;}

.postLinks {padding: 1px;}

.singleComment .postContent { padding-left:140px; }

.singleComment .postInner { margin-left:-150px; padding-left:150px; }

.singleComment .commentAuthor { float:left; width:130px; overflow:visible; margin-left:-140px !important; margin-left:-65px; max-width: 130px; }

.commentAuthor .avatar { margin:0px 0 10px; width:auto; max-width: 140px; }

.avatar, .avatarNew{ float:left; background: no-repeat bottom right !important; background: no-repeat bottom right; margin: 10px 0 0px 10px !important; margin: 10px 0 0px 5px;}

.avatar img,.avatarNew img { display: block; position: relative; background-color: #fff; border: 1px solid #a9a9a9; margin: -6px 6px 6px -6px; padding: 0px;}

.avatar img:hover,.avatarNew img:hover { display: block; position: relative; background-color: #fffff0; border: 1px solid #898989; margin: -6px 6px 6px -6px; padding: 0px; }

comments {background: no-repeat; padding:0 0 0 16px !important; line-height:12pt; font size: 0}



может тут какие-нибудь лишние? И еще-у меня не показываются иконки перед логинами. Если Вам не сложно, подскажите, пожалуйста. Заранее большое спасибо.

---

-посты-

[-tvicks]

здравствуйте...

а как моно сделать такую запись,когда прям напротив картинки,будет располагаться текст...или справа или слева)

тык



и что еще надо сделать ,чтоб извратиться так с почерком



тык



заранее спасибо)

@темы: текст

---

странное

[Daryl Hannah]

куда все подевалось?

СЕгодня просто поменяла цвета диза и оно куда то все исчезло=)

может что то не так в кодах? можете помочь?

коды

#diarySpiritLink {display:none}

body{ background-attachment:fixed; }

html { background: transparent !important; background-attachment:fixed; background: ; }

#myDiaryLink A{content:'Home sweet home';}

.atMusic em { font-size: 0 px; background: url('/userdir/3/7/9/6/379645/19718410.gif') no-repeat 0; padding-left: 100px !important; }

.atMusic em SPAN { position: absolute; left:-1000px;}

.atTag, .atMood, .arMusic {text-align:right!important;}

#myDiaryLink a {text-decoration:blink;}

a:hover,a:active{color:yellow !important}

A:HOVER{ font-size: 18 pt; }

A:HOVER{ font-family: verdana; }

A { TEXT-DECORATION: none;}

A:hover { TEXT-DECORATION: none; text-transform: none; border-bottom: dotted; border-width: 1px; border-bottom-color: #592e10;}

.paragraph A { TEXT-DECORATION: none;}

.paragraph A:hover { TEXT-DECORATION: none}

.singlePost, .menuSection { border-style:dotted; }

#postsCalendar{display:none}

#rssLink{display:none}

body.left{padding-left:10px !important;}

.left #wrapper{width:760px;margin: 0 0 0 -380px !important;padding:0 !important;position:relative;left:50%;//left:49.5%;}

.left #side{width:140px !important;margin:0 !important;}

.left #page-c{width:580px !important;padding:0 !important;}

.right #wrapper{width:760px;margin: 0 0 0 -380px !important;padding:0 !important;position:relative;left:50%;}

.right #side{width:140px !important;margin:0 !important;float:right}

.right #page-c{width:580px !important;padding:0 !important;}

.right #page-t {margin:0 !important;}

.singleComment .postContent { padding-left:140px; }

.singleComment .postInner { margin-left:-150px; padding-left:150px; }

.singleComment .commentAuthor { float:left; width:130px; overflow:visible; margin-left:-140px !important; margin-left:-65px; max-width: 130px; }

#TagsList{display:block !important;visibility:visible !important}

#myDiaryLink a{ color: #00ccff }

#thisDiaryOwner { position: absolute; right: -150px; top: 10px; background-image:; width:60px !important; text-align:center;}

p:first-letter { color:#CF192A; }

a:hover{cursor: auto;}

.menuSection {text-align:center; }

#pchs { float:left; visibility:hidden; }

#extratop { background: url('/userdir/3/7/9/6/379645/19930046.jpg') no-repeat; !important; width: 100%; height:210px; line-height: 100% !important;}



а вот диз

---

[крокер]

я убрала меню #side {position: absolute; left: -3000px;}(по моему это тот код)

основной блок центрирован.

Вопрос: как сделать чтоб картинка сверху была только над основным блоком?

---

SOS

[|ckazka|]

аааа...Люди, помогити плиз!Вот сижу я на дайрах, и тут мне приходит на у-мэйл сообщение "Почему у ти нет поля для того чтобы ввести тес для комента?"Вобщем я к вам с тем же вопросом.Вот код:

.favSmiles a:hover{ background:none; }

#menuNewDescussions{ text-decoration:blink; font-weight:bold; }

a,a:visited { color:#777777; text-decoration:none; }

a:hover, a:active { background:#99ccff; color:#fff; text-decoration:none; }

.header h2 { color:#990000; background-color:#fff }

.postLinksBackg a:hover {text-decoration: none; text-transform: none; border-bottom: dotted; border-width: 1px; border-bottom-color: #777777; color:#99ccff; background-color:#fff }

.postLinksBackg { font-size:9px !important; }

.postLinks {padding: 1px;}

#side{position:fixed}

#postTitle {width: 400px }

#allDiaryLink{display:none}

#favListLink{display:none}

#pchListLink{display:none}

#communityCatalogueLink{display:none}

#randomDiaryLink{display:none}

#diarySpiritLink{display:none}

#diarySupportLink{display:none}

#paySupportLink{display:none}

body{ background-attachment:fixed; }

#side { text-transform: lowercase; }

.left #wrapper{background:#ffffff;overflow:hidden;}

li a:link, a:active { cursor: crosshair;}

body {background: -repeat;}

Поможите?

@темы: diaryCSS