几秒钟后隐藏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内容

回答

相关问题