本文主要是介绍tab动态切换JS代码hover,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
一、用到的函数
一般在hover里编写切换代码
$('').hover(function(){
})
二、常用的代码:
1、取得当前元素的index
代码示例:index = $('.tab-h3-item').index($(this));
2、添加或去掉css
代码示例:
$('.tab-h3-home').removeClass('sel');
$(this).addClass('sel');
3、隐藏或显示元素或DIV块
$('.tn-list').hide();
$('#list'+index).show();
三、完整的代码示例:
$('.tab-h3-item').hover(function(){
index = $('.tab-h3-item').index($(this));
//选中当前tab
$('.tab-h3-item').removeClass('sel');
$('.tab-h3-home').removeClass('sel');
$(this).addClass('sel');
$('.tn-list').hide();
$('#list'+index).show();
},function(){
})
$('.tab-h3-home').hover(function(){
//选中当前tab
$('.tab-h3-item').removeClass('sel');
$('.tab-h3-home').removeClass('sel');
$(this).addClass('sel');
$('.tn-list').hide();
$('#list').show();
},function(){
})
这篇关于tab动态切换JS代码hover的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!