幾秒鐘後隱藏iframe內容

在我的網站上，我有一個聯繫表單。當用戶填寫表格並按下發送按鈕時，表格下會顯示一條消息。我希望消息在幾秒鐘後隱藏自己。我也想可能是風格的顏色和居中對齊等幾秒鐘後隱藏iframe內容

HTML

<div class="container"> 
    <form action="form_process.php" method="post" name="contact_form" target="myIframe"> 
     <div class="row"> 
      <div class="col-md-4"> 
       <input type="text" class="form-control" name="name" id="name" placeholder="Your Name" required> 
       <input type="email" class="form-control" name="email" id="email" placeholder="Your Email" required> 
       <input type="text" class="form-control" name="sub" id="sub" placeholder="Subject" required> 


      </div> 
      <div class="col-md-8"> 
       <textarea class="form-control" name="msg" id="msg" rows="15" cols="10" placeholder="Your Message" required></textarea> 
       <button type="submit" name="submit" class="btn btn-default submit-btn form-submit">SEND</button> 
      </div> 
     </div> 
    </form> 
    <div class="iframe-div"> 
     <iframe name="myIframe" id="myIframe"> 

     </iframe> 
    </div> 
</div>

CSS

.iframe-div { 
    text-align:center; 
    color: #3978bd; 
} 
#myIframe { 

    frameborder:0; 
    border:0 ; 
    cellspacing:0; 
    border-style: none; 
    width: 100%; 
    height: 60px; 
}

PHP

<?php 
    $name = $_POST['name']; 
    $email = $_POST['email']; 
    $sub = $_POST['sub']; 
    $msg = $_POST['msg']; 

    $message=$_POST['message']. 'Name: ' . $name . '"\n"Email: ' . $email. '"\n"Subject: ' . $sub; 
    $to = '[email protected]'; 
    $subject = 'New Message'; 

    mail($to, $subject, $message, $msg); 
    echo "Your Message has been sent"; 
?>

來源

2017-05-02 chaitu_teja

您的wow.js是否已加載到您的html底部？從HTML這就是插件它看起來像你試圖使用 –

是的它被加載 –

我其實不知道wow.js是誠實的，但你可以用jQuery很容易地做到這一點。而不是我複製一個帖子，你可以閱讀這個傢伙http://stackoverflow.com/a/820954/6208463 –

你可以使用類似這樣的消息：

$('.iframe-div').fadeIn('slow', function() { 
    $(this).delay(3000).fadeOut('slow'); 
});

當然，您應該將其添加到腳本的success邏輯。
希望這會有所幫助。

SYA :)

來源

2017-05-02 06:04:43 LebCit

感謝您的幫助 –

很高興爲您提供幫助，並瞭解您的聯繫表單可以按照您的要求工作。 SYA – LebCit

幾秒鐘後隱藏iframe內容

回答

相關問題