[英]Fade in and fade out between divisions
我有一个3个按钮的菜单,我想要做的是隐藏item11,item22和item33的图像。 当我点击按钮a时,item11淡入,如果我点击,则b item11淡出,item22淡入,依此类推。
我有这个菜单和部门的jsfiddle: https ://jsfiddle.net/0rqzh404/1/
我有这个淡入/淡出功能,但我不知道如何连接到HTML。
JQUERY:
$(document).on('click','#item1', function()
{
$("").fadeOut(1000, function(){
$("").hide();
$("").show();
$("").fadeIn(1000);
});
});
$(document).on('click','#item2', function()
{
$("").fadeOut(1000, function(){
$("").hide();
$("").show();
$("").fadeIn(1000);
});
});
$(document).on('click','#item3', function()
{
$("").fadeOut(1000, function(){
$("").hide();
$("").show();
$("").fadeIn(1000);
});
});
请帮忙。
你应该只使用li
按钮,这些将获得元素的ID,所以你会做这样的事情:
$(".item").hide();
$(".headlines li").click(function(){
var el = $(this), id = el.attr("id").match(/\d+$/)[0], iditem = "#item" + id+id;
$(".item").not(iditem).fadeOut(); //Hide elements
$(iditem).fadeIn()//Just show one element
});
我提醒你,我必须将id="item11", id="item11", id="item11"
id="item11", id="item22", id="item33"
id="item11", id="item11", id="item11"
为id="item11", id="item22", id="item33"
,因为这些必须独一无二。
https://jsfiddle.net/0rqzh404/47/这样的东西? 使用像$('.btn')
这样的单一类是一种简单的方法,也可以将多个动作组合在一起。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.