$(document).ready(function (){
  $("#marquee1").marquee();
});

$(function(){
                $("#marquee1").marquee({
                    loop: -1
                    // 初期時
                    , init: function ($marquee, options){
                        if( $marquee.is("#marquee2") ) options.yScroll = "bottom";
                    }
                    // メッセージ切替表示前
                    , beforeshow: function ($marquee, $li){
                        var $author = $li.find(".author");
                        if( $author.length ){
                            $("#marquee-author").html("<span style='display:none;'>" + $author.html() + "</span>").find("> span").fadeIn(850);
                        }
                    }
                    // メッセージ表示切替時（上から下にスライド表示された時）
                    , show: function (){
                    }
                    // メッセージスクロール完了後（スライド表示されたメッセージが左方向へすべてスクロールされた時）
                    , aftershow: function ($marquee, $li){
                        // find the author
                        var $author = $li.find(".author");
                        // hide the author
                        if( $author.length ) $("#marquee-author").find("> span").fadeOut(250);
                    }
                });

                $("#marquee2").marquee({yScroll: "bottom"});
            });
            var iNewMessageCount = 0;
            function addMessage(selector){
                iNewMessageCount++;
                var $ul = $(selector).append("<li>New message #" + iNewMessageCount + "</li>");
                // update the marquee
                $ul.marquee("update");
            }
            function pause(selector){
                $(selector).marquee('pause');
            }
            function resume(selector){
                $(selector).marquee('resume');
            }