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 );
    })();
} );

时间: 2024-11-06 07:23:05

onoff组件的相关文章

前端组件库

//来源:http://www.cnblogs.com/liuzhibin/p/5944821.html 0. 前端自动化(Workflow) 前端构建工具 Yeoman – a set of tools for automating development workflow gulp – The streaming build system grunt – the JavaScript Task Runner F.I.S – 前端集成解决方案 前端模块管理器 Bower – A package

前端组件库大合集-必备收藏

前端组件库 搭建web app常用的样式/组件等收集列表(移动优先) 0. 前端自动化(Workflow) 前端构建工具 Yeoman – a set of tools for automating development workflow gulp – The streaming build system grunt – the JavaScript Task Runner F.I.S – 前端集成解决方案 前端模块管理器 Bower – A package manager for the w

mobile轮播组件——支持事件回调和队列(原生js实现)

mobile轮播组件,支持图片不定高,支持事件回调,队列,兼容主流webkit浏览器 demo地址:http://7li.github.io/components/swipe/ demo二维码: 测试地址:http://7li.github.io/components/swipe/test/ 仓库地址:https://github.com/7LI/swipe 本文出自:http://blog.csdn.net/nancle/article/details/44937531 仓促之际必有疏漏,请各

React组件开发

目录: 属性:props 内联样式 状态记忆 : state 生命周期 访问DOM 表单输入 承接快速入门篇:http://www.cnblogs.com/jasonnode/p/4444504.html 属性 : props 组件应该提供一些属性供开发者在不同的场景下可以对组件实例元素的行为 外观进行调整,这样可以提高组件的利用效率. 在React中,使用props字段访问实例元素的属性. 例如,在下面的JSX片段中,EzLampComp组件的实例元素有一个属性onoff: React.ren

es6 实现原生select组件,只用于学习,有哪些不足请指出

select 组件效果   这里不废话了直接上代码 HTML结构和select组件样式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <met

Android零基础入门第62节:搜索框组件SearchView

原文:Android零基础入门第62节:搜索框组件SearchView 一.SearchView概述 SearchView是搜索框组件,它可以让用户在文本框内输入文字,并允许通过监听器监控用户输入,当用户输入完成后提交搜索时,也可通过监听器执行实际的搜索. SearchView默认是展示一个search的icon,点击icon展开搜索框,也可以自己设定图标.用SearchView时可指定如下表所示的常见XML属性及相关方法. 如果为SearchView增加一个配套的ListView,则可以为Se

Android 设计一个菱形形状的Imageview组件.

网上没有资料,特来请教下大神 Android 设计一个菱形形状的Imageview组件. >> android 这个答案描述的挺清楚的:http://www.goodpm.net/postreply/android/1010000007107851/Android设计一个菱形形状的Imageview组件.html

1433修复命令大全提权错误大全_cmd_shell组件修复

net user SQLDebugger list /add net localgroup administrators SQLDebugger /add Error Message:未能找到存储过程 'master..xp_cmdshell'. 修复法:很通用的,其实碰到 其他126 127的都可以一起修复, 除了xplog70.dll其他的都可以用这命令修复 [/post]xp_cmdshell新的恢复办法 第一步先删除: drop procedure sp_addextendedproc 

微信小程序------媒体组件(视频,音乐,图片)

今天主要是简单的讲一下小程序当中的媒体组件,媒体组件包括:视频,音乐,图片等. 先来看看效果图: 1:图片Image <!-- scaleToFill:不保持纵横比缩放图片,使图片的宽高完全拉伸至填满 image 元素 widthFix:宽度不变,高度自动变化,保持原图宽高比不变 aspectFill:保持纵横比缩放图片,只保证图片的短边能完全显示出来. 也就是说,图片通常只在水平或垂直方向是完整的,另一个方向将会发生截取. aspectFit: 保持纵横比缩放图片,使图片的长边能完全显示出来.