Вытащить ссылку "Мой дневник" из выпадающего меню

воскресенье, 18 декабря 2016

15:41

Вытащить ссылку "Мой дневник" из выпадающего меню

все записи пользователя в сообществе Йуууля

Торт в морду еще нужно заслужить

Добрый день! Столкнулась с такой проблемой:

При позиционировании блока меню "вверху" не могу вытащить ссылки "Мой дневник" и "Новая запись"
Пробовала фиксировать и двигать ссылку при помощи кода:

#myDiaryLink {display:block !important;visibility:visible !important;}
#myDiaryLink {padding:0 !important; position:absolute; margin-top: 60px!important; right:500px; padding-top:5px !important;}

Но проблема в том, что она все равно видна только при активности выпадающего блока #myDiaryLinks
Фиксировать сам #myDiaryLinks не хотелось бы. Есть ли возможность вытащить "Мой дневник", не делая видимым #myDiaryLinks?

@темы: меню

URL

Картинка. Два часа ночи. Тесная улица с бесконечными р... Все-таки жизнь странная штука... Вот один мой знакомый... Хорошая штуковина оказывается этот дневниковый клиент [из...

Попросил Алекса поменять местами колонки дневников "... Побывал как-то в трапезной буддийского монастыря. Крайне ... Сегодня из-за утренного недостатка адреналина :o были п...

Комментарии

18.12.2016 в 23:47

~Erika

Победа! Честь! Судьба! Баранина!

Йуууля, попробуйте так:

.top #myDiaryLinks.menuSection ul {
    display: block;
}

.top .menuSection#myDiaryLinks ul li:not(#myDiaryLink) {
    display: none;
}

.top .menuSection#myDiaryLinks ul {
    padding: 0 !important;
}

.top .menuSection#myDiaryLinks:hover ul li:not(#myDiaryLink) {
    display: block;
    padding: 0 7px;
}

.top .menuSection#myDiaryLinks #myAccountLink {
    margin-top: 7px;
}

.top .menuSection#myDiaryLinks #photolibLink {
    margin-bottom: 7px;
}

#myDiaryLink {
    position: absolute;
    top: -20px;
    left: 260px;
}

.top .menuSection#myDiaryLinks li#myDiaryLink:hover ~ li:not(#myDiaryLink) {
    display: none;
}

Для самых любознательных - код с комментариями

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

URL

19.12.2016 в 08:01

Йуууля

Торт в морду еще нужно заслужить

~Erika, К сожалению ничего не получилось =(((
Ссылка "Мой дневник" все также видна только при активности выпадающего меню, при чем само меню исчезает при наведении на ссылку
возможно ваш код конфликтует с моим кодом для меню?

 .menuSection {text-align: center;text-transform:capitalize;}
 #side {width: 970px; height:1px;}
 #globalLinks { position: absolute; top:30px; left: 935px; width:200px !important;}
 #myDiaryLinks { position: absolute; top: 350px; left: 945px; width:200px !important; }
 #thisDiaryOwner { position: absolute; top:200px; left: 935px; width:200px !important; visibility: visible !important; font-size:16px!important;}
 #globalLinks_title {display:block; width:170px; height:170px; left: 30px; line-height:500px; overflow:hidden; background: url("/userdir/9/6/0/4/960459/84679216.png") no-repeat; position:relative !important; font-size:16px!important;}
 #myDiaryLinks_title {display:block; width:170px; height:170px; left: 20px; line-height:500px; overflow:hidden; background: url('/userdir/9/6/0/4/960459/84679214.png') no-repeat; position:relative !important;}
 #thisDiaryOwner_title {display:block; width:170px; height:170px; left: 30px; line-height:500px; overflow:hidden; background: url('/userdir/9/6/0/4/960459/84679217.png') no-repeat; position:relative !important; }
 #side ul { width: 200px !important; background: rgba(255, 255, 255, 0.5) !important; border:solid 1px ##000000 !important; font: 16px Times New Roman !important; padding: 5px 15px 5px 5px !important; margin: 0px 0px 0px -5px !important;}
 #myDiaryLinks ul {position: absolute; left: 90px; top: 1px;}
 #thisDiaryOwner ul {position: absolute; left: 90px; top: 1px;}
 #globalLinks ul {position: absolute; left: 90px; top: 1px;}

Скрин (превью по клику) того как это все выглядит:

URL

19.12.2016 в 22:51

~Erika

Победа! Честь! Судьба! Баранина!

Йуууля, код действительно конфликтует, здесь Вы правы.
Я попробовала решить конкретно Вашу задачу и честно признаюсь - не получилось. У Вас есть анимация, для создания которой мой вариант решения не годится. Можно попробовать добиться желаемого, но анимация в итоге будет выглядеть чуть по-иному.
Но в любом случае код получится довольно сложным, придётся потратить немало времени. Проще оставить как есть.

URL