1

編集-jsファイルを見つけてホバーオーバー効果を削除することができました。

私はWPに取り組んでいます。ボタンをクリックしたときに表示する必要のあるオプチンフォームがあります。テーマによって提供される機能は、ホバーオーバー時にフォームを表示しますが、バグがあり、ユーザーエクスペリエンスが悪くなります。

ボタンを追加できましたが、現在のホバーオーバー機能を上書きする方法がわかりません。

これが私が持っているものです

Javascript

<script language="JavaScript">
    function toggle(id) {
        var state = document.getElementById(id).style.display;
            if (state == 'block') {
                document.getElementById(id).style.display = 'none';
            } else {
                document.getElementById(id).style.display = 'block';
            }
        } 
</script>

HTML

<div id="nav_subscription" class="subscription_form clearfix">
<span id="subscribe_dd" class="contrast"><?php gb_e( 'Get the Latest Deals' ) ?><span><a href="#" onclick="toggle('subscription_form_wrap');">Toggle Div</a></spa>

</div><!-- #main_navigation --> 

    <div id="subscription_form_wrap" style="display:none;">
    <div class="optinbar_close" style="bottom: 202px; left: -10px;"></div>                           
    <p class="fillout2">Συμπλήρωσε την παρακάτω φόρμα και μπες στο club επικοινωνίας του Fitness Forum για να σου στείλουμε αμέσως με email το δώρο σου. Απλά, γράψε το όνομα και το email σου και κλίκαρε 'Στείλτε το δώρο μου'.</p>   


<!-- Begin MailChimp Signup Form -->                                    
    <div id="mc_embed_signup">                  

    </div>
</div><!-- #header_subscription.subscription_form -->

CSS

#subscription_form_wrap {
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    background: none;
    background-color: #FFFFFF;
    padding: 0;
    float: left;
    position: absolute;
    top: 34px;
    right: 0;
    height: auto;
    min-width: 200px;
    border: 1px solid #CCC;
    font-size: 13px;
    }

#subscribe_dd {
    color: white;
    font-size: 16px;
    text-align: center;
    line-height: 17px;
    background-color: #999;
    width: 255px;
    height: 19px;
    -moz-border-radius-bottomright: 0;
    -webkit-border-bottom-right-radius: 0;
    border-bottom-right-radius: 0;
    }

.optinbar_close {
    float: right;
    background: url(assets/images/close3.png) no-repeat;
    display: inline;
    height: 32px;
    width: 32px;
    cursor: pointer;
    text-decoration: underline;
    color: white;
    position: absolute;
    right: 10px;
    }

こちらがウェブサイトへの[リンク]です。

「Έχειςήδηκερδίσειέναδώρο！」と書かれたナビゲーションバーの灰色のボックスを修正しようとしています。

4

1 に答える 1

1

それがあなたが望むものかどうかはわかりませんが、代わりに：

<span id="subscribe_dd" class="contrast">Έχεις ήδη κερδίσει ένα δώρο!<span>
    <a href="#" onclick="toggle('subscription_form_wrap');">Toggle Div</a></spa>

スパンを a href にラップすることもできます。

<a href="#" onclick="toggle('subscription_form_wrap');">
    <span id="subscribe_dd" class="contrast">Έχεις ήδη κερδίσει ένα δώρο!<span>
</a>

本当に Javascript のみを使用したい場合は、これも機能します。

<span id="subscribe_dd" class="contrast" onclick="toggle
    ('subscription_form_wrap')>Έχεις ήδη κερδίσει ένα δώρο!<span>

何のタグか分からなかった

</spa>

だったけど。;)

于 2013-01-31T23:27:07.637 に答える