下拉菜单中的 href 和 span
href and span in dropdown menu
在目前的情况下,我们的网站上有一个语言选择器,允许人们通过单击相应的标志在 2 种语言之间进行选择。
但是,由于添加了新语言,我们希望将其更改为下拉列表,最好在其中也包含语言名称。
这是当前代码 + 我的努力:
echo "<div id='languages-container'>";
// Show the language switcher
foreach($translationController->getLanguages() as $language){
$isSSL = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off') || $_SERVER['SERVER_PORT'] == 443;
$path = 'http'.(($isSSL) ? 's' : '').'://' . $_SERVER['HTTP_HOST'] . strip_tags($_SERVER['REQUEST_URI']);
$path = (strpos("x".$path,'?') !== false) ? substr($path, 0, strpos($path, "?")) : $path;
$path.= "?lang=" . $language;
$selected = $_COOKIE['webba_translator_language'] == $language ? 'selected' : '';
echo "<a href='{$path}'><span class='language {$language} {$selected}'></span></a>";
}
//15-9 Test, not working
echo "<select>
<option><a href='{$path}'><span class='language {$language} '></span>English</option>
<option><a href='{$path}'><span class='language {$language} '></span>Nederlands</option>
</select>";
echo "</div>";
和css:
#languages-container .language {
width: 20px;
height: 20px;
float: left;
margin: 2.5px 5px;
background-position: center center;
background-size: cover;
}
#languages-container .language.selected {
outline: 2px solid black;
outline-offset: 3px;
}
.language.nl_NL {
background-image: url('../img/lang/nl_NL.png');
}
.language.en_US {
background-image: url('../img/lang/en_US.png');
}
它是一个 WiP,因此格式化在待办事项列表中..
我的问题是:我怎样才能将标志放入下拉列表而不是只有 2 个可点击图标?
谢谢!
这个问题已被我的一位同事使用 Javascript 代码解决:
foreach($translationController->getLanguages() as $language){
$isSSL = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off') || $_SERVER['SERVER_PORT'] == 443;
$path = 'http'.(($isSSL) ? 's' : '').'://' . $_SERVER['HTTP_HOST'] . strip_tags($_SERVER['REQUEST_URI']);
$path = (strpos("x".$path,'?') !== false) ? substr($path, 0, strpos($path, "?")) : $path;
$path.= "?lang=" . $language;
$selected = $_COOKIE['webba_translator_language'] == $language ? 'selected' : '';
if($selected) {
$selectedString = "<a href='" . $path . "'><span class='language " . $language . "'></span></a>";
}
else{
$restLanguages[] = "<a href='" . $path . "'><span class='language " . $language . "'></span></a>";
}
}
echo "<div dir='ltr' id='languages-container' style='display: none;'>";
echo $selectedString;
echo "<div id='languages-container-hover' style='display: none;' >";
foreach($restLanguages as $restString){
echo $restString;
}
echo "</div>";
echo "</div>";
在目前的情况下,我们的网站上有一个语言选择器,允许人们通过单击相应的标志在 2 种语言之间进行选择。 但是,由于添加了新语言,我们希望将其更改为下拉列表,最好在其中也包含语言名称。
这是当前代码 + 我的努力:
echo "<div id='languages-container'>";
// Show the language switcher
foreach($translationController->getLanguages() as $language){
$isSSL = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off') || $_SERVER['SERVER_PORT'] == 443;
$path = 'http'.(($isSSL) ? 's' : '').'://' . $_SERVER['HTTP_HOST'] . strip_tags($_SERVER['REQUEST_URI']);
$path = (strpos("x".$path,'?') !== false) ? substr($path, 0, strpos($path, "?")) : $path;
$path.= "?lang=" . $language;
$selected = $_COOKIE['webba_translator_language'] == $language ? 'selected' : '';
echo "<a href='{$path}'><span class='language {$language} {$selected}'></span></a>";
}
//15-9 Test, not working
echo "<select>
<option><a href='{$path}'><span class='language {$language} '></span>English</option>
<option><a href='{$path}'><span class='language {$language} '></span>Nederlands</option>
</select>";
echo "</div>";
和css:
#languages-container .language {
width: 20px;
height: 20px;
float: left;
margin: 2.5px 5px;
background-position: center center;
background-size: cover;
}
#languages-container .language.selected {
outline: 2px solid black;
outline-offset: 3px;
}
.language.nl_NL {
background-image: url('../img/lang/nl_NL.png');
}
.language.en_US {
background-image: url('../img/lang/en_US.png');
}
它是一个 WiP,因此格式化在待办事项列表中.. 我的问题是:我怎样才能将标志放入下拉列表而不是只有 2 个可点击图标?
谢谢!
这个问题已被我的一位同事使用 Javascript 代码解决:
foreach($translationController->getLanguages() as $language){
$isSSL = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off') || $_SERVER['SERVER_PORT'] == 443;
$path = 'http'.(($isSSL) ? 's' : '').'://' . $_SERVER['HTTP_HOST'] . strip_tags($_SERVER['REQUEST_URI']);
$path = (strpos("x".$path,'?') !== false) ? substr($path, 0, strpos($path, "?")) : $path;
$path.= "?lang=" . $language;
$selected = $_COOKIE['webba_translator_language'] == $language ? 'selected' : '';
if($selected) {
$selectedString = "<a href='" . $path . "'><span class='language " . $language . "'></span></a>";
}
else{
$restLanguages[] = "<a href='" . $path . "'><span class='language " . $language . "'></span></a>";
}
}
echo "<div dir='ltr' id='languages-container' style='display: none;'>";
echo $selectedString;
echo "<div id='languages-container-hover' style='display: none;' >";
foreach($restLanguages as $restString){
echo $restString;
}
echo "</div>";
echo "</div>";