onoff组件

/*
 head-onoff.js
 by sunhw 2014-9-17
 .head-btn 这个用于遍历出发浮层展现dom class无具体样式
 .show-panel 这个用于展现被隐藏的dom节点
 */
T.dom.ready( function() {
    (function() {
        var subMenuLayout = T.get( 'subMenuLayout' );
        var userMsgLayout = T.get( 'userMsgLayout' );
        var historyLayout = T.get( 'historyLayout' );
        var isShowPanel = function( dom ) {
            var node = T.query( '.head-btn', dom )[ 0 ];
            var parentNode = node.parentNode;
            var timer = 0, ttl = 200;
            var off = function() {
                T.removeClass( parentNode, 'show-panel' );
            };
            var onMouseOver = function() {
                clearTimeOut();
                T.addClass( parentNode, 'show-panel' );
            };
            var onMouseOut = function() {
                clearTimeOut();
                timer = setTimeout( off, ttl );
            };
            var clearTimeOut = function() {
                clearTimeout( timer );
            };

            T.on( node, 'mouseenter', onMouseOver );
            T.on( node, 'mouseleave', onMouseOut );
            T.on( parentNode, 'mouseenter', clearTimeOut );
            T.on( parentNode, 'mouseleave', onMouseOut );
        };
        subMenuLayout && isShowPanel( subMenuLayout );
        userMsgLayout && isShowPanel( userMsgLayout );
        historyLayout && isShowPanel( historyLayout );
    })();
} );

posted @ 2014-12-03 11:29  sunhw360  阅读(135)  评论(0编辑  收藏  举报