博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
选项卡+轮播的实现
阅读量:5039 次
发布时间:2019-06-12

本文共 3553 字,大约阅读时间需要 11 分钟。

html:

型号 BR/FS-03

音乐放松椅

(按摩型)

净重 124KG
材质 真皮
尺寸 长93CM*宽90CM*高100CM
展开角度 160°
配置组成

1.音乐放松功能椅1张

2.液晶触控面板1个
3.内置高保真音箱1套
4.视听资料1套
5.音乐耳机1个
6.音乐放松椅使用说明书1本

型号 BR/FS-02

音乐放松椅

(标准型)

净重 60KG
材质 真皮
尺寸 长93CM*宽90CM*高100CM
展开角度 110°-165°
配置组成

1.音乐放松功能椅1张

2.12寸显示器1台
3.显示器支架1套
4.内置高保真音箱1套
5.视听资料1套
6.音乐耳机1个
7. 音乐放松椅使用说明书1本

型号 BR/FS-01

音乐放松椅

(基础型)

净重 55KG
材质 真皮
尺寸 长93CM*宽90CM*高100CM
展开角度 110°-165°
配置组成

1. 音乐放松功能椅1张

2. 内置高保真音箱1套
3. 视听资料1套
4. 音乐耳机1个
5. 系统控制器1个
6. 音乐放松椅使用说明书1本

基础型 标准型 按摩型
体感共振
人体工程学设计
音乐放松系统
高保真音箱
智能调节
存储系统
液晶播放器
音乐随动
太空舱零重力模式
仿真人按摩
远红外加热

css:

/*main4 */.z_main4{
padding-bottom:60px;}.tabbox{
width:1200px;margin:0 auto;}.nav-list{
height:60px;padding-bottom:30px;}.lists{
width:300px}.nav-list li{
float:left;width:300px;text-align: center;background:#a4a4a4;}.list_w>li{
height:68px; width:300px;}.nav-0{}.nav-1{
cursor:pointer;}.nav-2{
cursor:pointer;}.nav-list .nav-cus-0{
background:url(../images/z_tab_bg.png) no-repeat center;}.nav-list .nav-cus-1{
background:url(../images/z_tab_bg.png) no-repeat center;}.nav-list .nav-cus-2{
background:url(../images/z_tab_bg.png) no-repeat center;}.nav-list .nav-cus-3{
background:url(../images/z_tab_bg.png) no-repeat center;}.nav-list .nav-cus-0,.nav-list .nav-cus-1,.nav-list .nav-cus-2,.nav-list .nav-cus-3{
padding-bottom:17px; background-size:300px 85px;}.nav-0 a,.nav-1 a,.nav-2 a,.nav-3 a{
font-family:"微软雅黑";color:#fff;height:68px;line-height:68px;font-size:24px;}.nav-cus-0 a,.nav-cus-1 a,.nav-cus-2 a,.nav-cus-3 a{
font-family:"微软雅黑";color:#fff;height:68px;line-height:68px;font-size:24px;}.nav-0 a:hover,.nav-1 a:hover,.nav-2 a:hover,.nav-3 a:hover{
font-family:"微软雅黑";color:#fff;height:68px;line-height:68px;font-size:24px;}.contant{
width:1200px;overflow:hidden;position:relative;}.inner{
width:4800px;position:relative;}.contant-con{
float:left;width:1200PX;}

js:

/** * Created by h-0002 on 2017/6/5. */var n_c_ser = 0;//设置初始值为0;function t_player(cur){    $('ul.nav-list > li').eq(n_c_ser).removeClass("nav-cus-"+n_c_ser);    if(cur==null){        n_c_ser = ++n_c_ser % 4;   //递加函数    }else{        n_c_ser = cur;    }    if(n_c_ser !=0 ){    }    $('.inner').animate({marginLeft:(-1 * n_c_ser * 1200) + 'px'});//下面内容的动画效果左移动1024px;    $('ul.nav-list > li').eq(n_c_ser).addClass("nav-cus-"+n_c_ser);    $('ul.nav-list > li').eq(n_c_ser).addClass("nav-cus-"+n_c_ser);    var Hig = $(document).scrollTop();    if (Hig > 5200) return false;}var n_t = setInterval('t_player()', 5000);//每隔5秒 执行一次$('ul.nav-list > li span').hover(function(){
//当我鼠标悬浮上去的时候 var self = this; clearInterval(n_t); //清除动画 $('.inner').stop(); var mid = $(this).parent().index() $('ul.nav-list > li').eq(n_c_ser).addClass("nav-cus-"+n_c_ser); t_player(mid);},function(e){ n_t = setInterval('t_player()', 5000);//当鼠标离开的时候 继续执行上面循环的函数});$('.inner .contant-con').hover(function(){
//当我鼠标悬浮上去的时候 clearInterval(n_t); //清除动画},function(e){ n_t = setInterval('t_player()', 5000);//当鼠标离开的时候 继续执行上面循环的函数});

 

转载于:https://www.cnblogs.com/wolflower/p/6951599.html

你可能感兴趣的文章
8086中的七种寻址方式
查看>>
秒杀系统解决方案
查看>>
Java动态代理机制
查看>>
【Git】Git工具常用命令
查看>>
ipmsg 绑定tcp错误
查看>>
九型人格判定
查看>>
NOPI读取模板导出(Excel中追加数据)
查看>>
linux mail 命令参数
查看>>
JAVA防盗链在报表中的应用实例
查看>>
Windows Azure Web Site (11) 使用源代码管理器管理Azure Web Site
查看>>
【转】Xcode托管代码到oschina中的教程
查看>>
python基于matplotlib绘图
查看>>
Gvim编码学习笔记
查看>>
IsPostBack
查看>>
android 网络语音电话合集 此文为转载备份
查看>>
hdu 5071 vector操作恶心模拟
查看>>
ECShop 常见问题索引
查看>>
0916 编程实验一 词法分析程序
查看>>
angular和echarts的结合使用,折线图指令
查看>>
洛谷 P1227 [JSOI2008]完美的对称
查看>>