jQueryで上からslideToggleでメッセージを出す #JavaScript

はじめに

slideToggleを使ってニュルっとメッセージを出す方法の記録です。

jQueryのコード

以下のコードでメッセージの出す、戻すを行う。
表示するメッセージを受け取った場合は空白を全て取り除く。
そしてslideToggleで表示し、5秒後にslideToggleで戻す。

let $slideMsg = $('#js-slide-msg');
let msg = $slideMsg.text();
  if(msg.replace(/\s+/g, "")){
   $slideMsg.slideToggle().show();
   setTimeout(function(){
    $slideMsg.slideToggle().show();
   }, 5000);
  }

表示について

$msgに表示するメッセージが入っていれば表示させる。

<div id="js-slide-msg">
    <?php if(!empty($msg) echo $msg; ?>
</div>