1

私は奇妙な問題に直面しています。私はHTMLテンプレートを使用していますが、実際には中央にボックスがある1ページだけです。ボックスの内容は変更される可能性があり、ページ上部のいくつかのボタンで別のバージョンに移動できます。

ランディングビューに段落を追加しましたが、別のビューに移動して戻ると、テキストが消えます。

問題は、テキストが表示されないことではなく、テキストが完全に消えて残るだけであることがわかります。

<div id="comment2" class="one-half"></div>

何が原因なのかわかりませんが。

これが私のHTMLです：

<div id="content_wrapper">
    <div id="header"><span>Το <b>INTRO HALL</b> είναι το <b>TOP</b>!</span><div id="close"></div></div>
    <div id="content">
    <div class="scroll-pane">
        <div class="content" id="content1">
        <div id='subscribe_label'>Η ιστοσελίδα του γυμναστηρίου Intro Hall θα ανοίξει σε:</div>
        <div id="counter"></div><div class="clear"></div>
        <div class="form_title"><h1>Κέρδισε ένα δώρο!</h1></div>
        <div class="column_cont">
        <div id="comment2" class="one-half"><p>Συμπλήρωσε τη διπλανή φόρμα για να μπεις στο Club Επικοινωνίας του Intro Hall και κέρδισε ένα δώρο. Απλά γράψε το όνομα και το email σου και κλίκαρε 'Στείλτε το δώρο μου!'.</p></div>
            <!-- Begin MailChimp Signup Form -->
<div id="mc_embed_signup" class="one-half" style="float:right;">
<form action="http://topgreekgyms.us6.list-manage2.com/subscribe/post?u=d6acf8949532b107b7b21c9d0&amp;id=e2131451dc" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>

<div class="mc-field-group">
    <input type="text" value="" name="FNAME" class="required" id="firstname" placeholder="Όνομα">
</div>

<div class="mc-field-group" style="margin-bottom:4px;">
    <input type="email" value="" name="EMAIL" class="required email" id="primaryemail" placeholder="Email" style="float:right;">
</div>

    <div id="mce-responses" class="clear">
        <div class="response" id="mce-error-response" style="display:none"></div>
        <div class="response" id="mce-success-response" style="display:none"></div>
    </div>  

    <div class="clear"><input type="submit" value="ΣΤΕΙΛΤΕ ΤΟ ΔΩΡΟ ΜΟΥ!" name="subscribe" id="mc-embedded-subscribe" class="button_link hover_fade large_button red"></div>
</form>
</div>

<!--End mc_embed_signup-->
</div>          
</div>

そしてこれがCSSです

#content_wrapper {
        position:absolute;
        width:506px;
        height:506px;
        z-index: 1000;
        top:0;
        left:0;
        /* Fallback for web browsers that doesn't support RGBa */
        background: rgb(62, 62, 62);
        /* RGBa with 0.6 opacity */
        background: rgba(0, 0, 0, 0.52);
}

#header {
        width:506px;
        height:47px;
        background: #161616;
}

#header span {
    display:block;
    margin:auto;
    height: 100%;
    line-height: 47px;
    width:447px;
    color: #ffffff;
    padding: 0px 29px 0 29px;
    background: #ac0003;
    text-align:center;
    font-family: arial;
    font-size: 23px;
    text-transform: none;
    word-spacing: 5px;
}

#content {
    width: 502px;
    height: 306px;
    border: 2px solid #161616;
    border-width: 0 2px 0 2px;
    margin-top:-15px;
    padding-top:15px;
}

.content {
        display:none; 
        width: 458px;
}

#close {
    position: absolute;
        top:11px;
        right:12px;
        background: transparent url(../img/close.png) no-repeat;
        width:25px;
        height: 25px;
        cursor: pointer;
        display:none;
}

.column_cont {
    margin: 0 -15px 0 0px;
    clear:both;
}

.clear {clear:both;}

#comment2 {
color: #fff;
display:block;
font-size: 16px;
text-align: justify;
line-height: 20px;
margin-bottom:10px;
}

.one-half, .one-third, .two-third, .one-fourth,  .three-fourth {
    margin:0 5px 0 15px;
    float:left;
}

.one-half {
    width:206px;

}

また、ここにウェブサイトへのリンクがあります。

助けや意見を事前に感謝します！

4

2 に答える 2

3

あなたのbig_countdown.jsファイルでは、閉じるボタンに以下を含むリスナーがありますdocument.getElementById('comment2').innerHTML = "";：

$("#close").click(function() {
        $('.content').each(
            function() {
                $(this).fadeOut('fast');
            });
        $('#content1').stop().fadeIn('fast');
        $("#close").css('display','none');
                $('#dots div').each(
            function() {
                $(this).removeClass('dot_active');
            });
        $("#dot1").addClass('dot_active');
        window.setTimeout(function() {
         api.reinitialise();
        },300);

        // Remove this line below
        document.getElementById("comment2").innerHTML="";
});

この最後の行を削除すると、問題が解決するはずです。

于 2013-03-26T02:56:46.660 に答える
2

優れたJavaScriptデバッガーを使用すると、次回はこれをすばやく理解するのに役立ちます。FixfoxのアドインであるFirebugは最高の1つです。albertxingと同じ答えを得るには、次の手順を実行できます。

  1. ページを読み込む
  2. 消えていく要素を右クリックし、「Firebugで要素を検査」を選択します
  3. あなたの

    要素はFirebugのHTMLビューアで強調表示されます

  4. この要素を右クリックして、[要素の削除時に中断]を選択します
  5. Webページの下部にあるボタンを切り替えて、

    要素が消える

  6. Firebugは変更を検出し、変更の原因となったコード行にすぐに移動します。

プレスト！

于 2013-03-26T03:05:14.023 に答える