Javascript-форум - Опять напоролся на якорь

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Опять напоролся на якорь (https://javascript.ru/forum/dom-window/45173-opyat-naporolsya-na-yakor.html)

Опять напоролся на якорь

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

Вот каноничная схема списочного меню

<ul id="nav_menu" class="nav_menu">
	<li data-menu="orders">
		<a href="#">Parent 1</a>
		<ul data-event="click">
			<li><a href="#">Parent 1 &raquo; Child 1</a></li>
			<li><a href="#">Parent 1 &raquo; Child 1</a></li>
		</ul>
	</li>

Вот стили (не нашел тут спойлера, мотайте до конца)

Код:

ul.nav_menu {

        background-color:brown;

        height: 25px;

        font-size: 12px;

        font-family: Tahoma, Arial, Helvetica, sans-serif;

    margin: 0;

    padding: 0;

}



        .nav_menu li {

                list-style: none;

                float: left;

                border-left:1px solid rgb(230,180,180);

                line-height: 25px;

                height:25px;

                font-weight: bold;

                display:block;

                padding: 0 10px;

        }

        

        .nav_menu li:hover  {

                background: rgb(200,200,200);

                color: black;

        }

        

        /*

        * hidden list

        */

        .nav_menu  li ul {

                display: none;

                position: absolute;

                padding: 0;

                margin-left:-10px;

                background: rgb(230,230,230);

                color:black;

        }



        .nav_menu li ul li {

                float: none;

        }



        .nav_menu li ul li a {

                text-decoration: none;

                color: black;

        }

        

        .nav_menu li a {

                text-decoration: none;

                color: white;

        }



        .nav_menu li a:hover {

                color: black;

        }

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

Ни в какую не хочет ничего наследовать этот якорь и точка. В смысле я наверно не знаю как это делается, хотя уже докопался до зашибенской страницы типа http://www.quirksmode.org/css/selectors/

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

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

Если вообще якорь не трогать, он будет реликтового синего цвета. С этого все начинается. Цвет текста родителя не наследуется, торчит синий подчеркнутый как в конце 90х и все пофигу ему что уже СЫЫ3 вышел.

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

Первичную заготовку я тоже где-то стянул, от нее почти ничего не осталось. За годы я так и не врубился как устроены CSS, хотя вроде с другими языками особых проблем не возникало. По-моему CSS разработан аутами и для аутов. :)

Цитата:

Сообщение от kostyanet

Ни в какую не хочет ничего наследовать этот якорь и точка

Он ничего и не будет наследовать, ибо ты ему явно указал: color:white его собственное значение цвета. Так что ему незачем че-то там наследовать, своего ведь хватает.

Чтоб наследовал пиши color: inherit, и будет наследовать.

Как альтернатива, пиши

.menu li a:hover,
.menu li:hover a{
     color: black;
}

Цитата:

Сообщение от kostyanet

По-моему CSS разработан аутами и для аутов.

Скорее, CSS ауты и не могут освоить, вот и жалуются на него.
Не то чтобы CSS идеален, свою задачу язык выполняет прекрасно. А если принять во внимание новейшие модули - то это просто кайф.
Вобще язык очень простой. но есть конечно неочевидные моменты.

Цитата:

Сообщение от danik.js

Чтоб наследовал пиши color: inherit, и будет наследовать.

Ип...ческая сила. Вроде с этого и начал, проинхерил все, потом похерил, потом ява-скрипт, потом доки читать, примеры искать и все такое.

Блин, как-то надо запомнить, я же говорю, напарываюсь и забываю. Аут? Так вот ауты ничего не забывают, в этом их диагноз и состоит. Смотрели же по крайней мере человека дождя.

В общем спасибо, проинхерил - все работает.

Попутно, посклльку быстро все скончалось. В стопицотый раз лезу копипастить из какого-нить шаблона строчки типа

<link type="text/css" rel="stylesheet" href="menu.css"/>
<script type="text/javascript" src="menu.js"></script>

Нормальный человек подумает что нормально инклюды инклюдятся по одной схеме. Но блин не в хтмл. Если не вижу как, то не могу вспомнить где href, а где src,

Ну не может у линка быть источник. Линк - это ссылка (reference). А скрипт, если он не встроенный, то как и остальные ресурсы (img, iframe и тд) - имеет source.

Хотя раньше тоже задумывался, зачем было так запутывать. На мой взгляд можно было бы сделать так:

<style src="menu.css"></style>
<script src="menu.js"></script>

Я начинал с С, асса и басика и поэтому с трудом осваиваю уеб-технологии. Кто сразу с них начал - я же вижу - им гораздо проще.

К слову, разрабатывалась когда-то такая штука как XHTML2.0 :write: эххх. Не взлетело... А там так все круто придумано...
Так вот, там атрибут src можно было указать любому элементу.
Код из документации:

<style src="style.css" type="text/css" media="screen" />
<span src="photo.jpg" media="screen">Me at work</span>
<span src="photo-hires.jpg" media="print">Me at work</span>

http://www.w3.org/TR/xhtml2/mod-styl....html#sec_28.1.

Нашел формальный косяк. В родительском корневом элементе не было цвета текста. А от него наследуются и скрытые списки, и открытые, и все такое, в общем х проссышь.

Но теперь все четко работает как доктор прописал.

Про XHTML2.0 не слышал (вероятно его задавил веб-два-ноль), но однажды пришлось написать сайт полностью на xml'е, то есть xml+xslt и как говорят с тех пор у меня двойственные чуйства. С одной стороны эта технология потрясает универсальностью и фундаментальностью. С другой стороны никто не хочет ее развивать (хотя ей в обед 50 лет) и даже микрософт пугавший адобу своим каким-то Х-языком для препресса сдулся под вековой тяжестью утырного посткрипта.