Question

我有＆＃34;按钮＆＃34;，它改变了网页上的语言：

<div class="wrapper">
    <a class="button-link" href= "<?php echo qtrans_convertURL(get_permalink(), 'de'); ?>" target="_parent">DE</a>
    <a class="button-link" href="<?php echo qtrans_convertURL(get_permalink(), 'en'); ?>" target="_parent">EN</a>
</div>

我做了一个悬停效果，表明将要选择哪种语言：

.button-link:hover {
    color: #fff;
    border-bottom: 2px solid #e95252;
}

现在我试图将此边界线保持在所选语言下。这样用户总能看到活动语言。我认为它会如此简单：

.button-link:active{}

但它没有按照我想要的方式工作，所以我想我必须编写一个php函数。我找到了如何显示当前页面的示例，但它与语言不同。由于语言按钮独立于页面，因此，如果某人选择了英语，则应始终加下划线。

Answer 1

执行此操作的一种方法是向class="<?= $lang = 'de' ? 'active' : '' ?>"添加.button-link。因为他们都在做同样的事情所以会更简单：

<?php
    $langs = array('de', 'fr', 'it', 'en');
?>

<div class="wrapper">
    <?php foreach ($langs as $lang) : ?>
        <a class="button-link" href="<?= qtrans_convertURL(get_permalink(), $lang); ?>" class="<?= qtrans_getLanguage() == $lang ? 'active-lang' : '' ?>" target="_parent"><?= strtoupper($lang); ?></a>
    <?php endforeach; ?>
</div>

在css中你只需选择该类作为

.active-lang {}

或

.button-link.active-lang {}

Answer 2

您可以尝试执行以下操作 PHP：

<?php if(qtrans_getLanguage()=='de'): ?>
<a class="button-link active" href= "<?php echo qtrans_convertURL(get_permalink(), 'de'); ?>"
       target="_parent">DE</a>
<?php endif; ?>

CSS：

.active {
   border-bottom: 2px solid #e95252;
}

祝你好运！

Answer 3

这样的事情可以做到：定义新类＆gt;

.button-link-active {
    border-bottom: 2px solid #e95252;
}

然后使用以下代码在链接中添加类：

<?php if ( qtrans_getLanguage() == "en" ){ echo "button-link-active" } ?>

最终代码将是这样的：

<a class="button-link <?php if ( qtrans_getLanguage() == "en" ){ echo "button-link-active" } ?> " href= "<?php echo qtrans_convertURL(get_permalink(), 'de'); ?>" target="_parent">DE</a>

php / css / html语言按钮当前语言

3 个答案: