Show language names on hover
This commit is contained in:
@ -1,4 +1,4 @@
|
|||||||
<ul class="languages">
|
<ul class="languages">
|
||||||
{% for lang in supported_langs -%}
|
{% for lang in supported_langs -%}
|
||||||
<li><a href="{{ change_lang(lang) }}" rel="alternate" hreflang="{{ lang }}" title="{{ lang_names[lang] }}"><div class="menuitem"><img src="{{ get_flag(lang) }}" alt="{{ lang_names[lang] }}" /></div></a></li>
|
<li><a href="{{ change_lang(lang) }}" rel="alternate" hreflang="{{ lang }}"><div class="menuitem"><img src="{{ get_flag(lang) }}" /><div class="langname">{{ lang_names[lang] }}</div></div></a></li>
|
||||||
{% endfor %}</ul>
|
{% endfor %}</ul>
|
||||||
|
@ -30,6 +30,17 @@ div.navigation {position:relative;}
|
|||||||
ul.languages {margin: 0 2px !important;}
|
ul.languages {margin: 0 2px !important;}
|
||||||
ul.languages li {display:inline-block; *display:inline; *zoom:1; margin: 0 -2px !important;}
|
ul.languages li {display:inline-block; *display:inline; *zoom:1; margin: 0 -2px !important;}
|
||||||
|
|
||||||
|
.langname {
|
||||||
|
background: green;
|
||||||
|
display: none;
|
||||||
|
padding: 0.5em;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
text-align: center;
|
||||||
|
top: 4em;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
/* Dropdown menu CSS */
|
/* Dropdown menu CSS */
|
||||||
|
|
||||||
menu ul,
|
menu ul,
|
||||||
@ -136,6 +147,9 @@ menu ul,
|
|||||||
padding: 10px;
|
padding: 10px;
|
||||||
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
|
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
|
||||||
}
|
}
|
||||||
|
#cssmenu .has-sub ul li div.menuitem:hover .langname {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
#cssmenu .has-sub ul li:hover > div.menuitem,
|
#cssmenu .has-sub ul li:hover > div.menuitem,
|
||||||
#cssmenu .has-sub ul li:hover > a > div.menuitem {
|
#cssmenu .has-sub ul li:hover > a > div.menuitem {
|
||||||
background: #8bbc51;
|
background: #8bbc51;
|
||||||
|
Reference in New Issue
Block a user