tabslider实现手机端移动端选项卡切换效果代码

代码语言:html

所属分类:选项卡

代码描述:tabslider实现手机端移动端选项卡切换效果代码

代码标签: 移动 选项 切换 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">

    <style>
        * {
    	-webkit-box-sizing: border-box;
    	-moz-box-sizing: border-box;
    	box-sizing: border-box;
    }
    
    html {
    	-ms-touch-action: none;
    }
    
    body,ul,li {
    	padding: 0;
    	margin: 0;
    	border: 0;
    	list-style:none
    }
    
    body {
    	font-size: 12px;
    	font-family: ubuntu, helvetica, arial;
    }
    #wrapper {
    	margin:10px;
    	background: #fff;
    }
    * {-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-user-select:none;outline:0;-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent}
    /***************************/
    .tabSlider-transition{
    	transition: transform 0ms ease; 
    	-ms-transition: -ms-transform 0ms ease; 
    	-moz-transition: -moz-transform 0ms ease;
    	-webkit-transition: -webkit-transform 0ms ease;
    	-o-transition: -o-transform 0ms ease;
    }
    .tabSlider-animate{
    	transition: transform 400ms ease; 
    	-ms-transition: -ms-transform 400ms ease; 
    	-moz-transition: -moz-transform 400ms ease;
    	-webkit-transition: -webkit-transform 400ms ease;
    	-o-t.........完整代码请登录后点击上方下载按钮下载查看

网友评论0