请参阅我的脚本在这里:LIVE EXAMPLEjQuery函数 - 难以理解的行为
有我注意到一个难以理解的行为。
的Onload 'All'
有3个选项明显 - 但是当你切换到'logo'
和回'all'
我们有4
为什么?第一个标签中应该有4个项目。
如何进行脚本工作:
- onload事件 - 我已经定义了我们的
var filterClass = "all";
是所有这意味着,只显示li
与'all'
类。 - 当您选择一些正面的顶部菜单 - 它正在它的类,并且使用相同的类(“礼”具有多类)
- 上的每一个变化发现
li
我们运行CreateTabs
功能基本上检查有多少个“礼”我们有,并在制表符(每个选项卡上4)。
的Onload素文字 - 这CONTROLES类:
$('#portfolio-items li').CreateTabs();
var filterClass = "all";
$('.portfolio-filter li a').click(function() {
$('.portfolio-filter > .selected').prop('class', '');
$(this).parent('li').addClass('selected');
filterClass = $(this).attr('class');
$('#portfolio-items li').hide();
$('#portfolio-items li.' + filterClass).show();
$('#portfolio-items').CreateTabs(filterClass);
});
CreateTabs脚本:
(function($) {
$.fn.CreateTabs = function(filterClass) {
var CoundNumberOfDivs = $('#portfolio-items li:visible').length;
$('.pagination li a').hide();
if (CoundNumberOfDivs <= 4) {
return false;
}
else {
var num = Math.ceil(CoundNumberOfDivs/4);
$('.pagination li a:lt(' + num + ')').show();
$('#portfolio-items li').hide();
if (filterClass === undefined) {
$('#portfolio-items li:lt(4)').show();
} else {
$('#portfolio-items li.' + filterClass + ':lt(4)').show();
}
}
};
})(jQuery);
的Onload脚本CONTROLES TABS
$('ul.pagination li a').click(function(event) {
$('ul.pagination li .active').removeClass('active');
$(this).addClass('active');
var PI = $('#portfolio-items li' + (filterClass !== undefined) ? '.' + filterClass : '');
$('#portfolio-items li').hide();
if ($(this).hasClass('href-1')) {
PI.slice(0, 4).show();
}
else if ($(this).hasClass('href-2')) {
PI.slice(4, 8).show();
}
else if ($(this).hasClass('href-3')) {
PI.slice(8, 12).show();
}
else if ($(this).hasClass('href-4')) {
PI.slice(12, 16).show();
}
else if ($(this).hasClass('href-5')) {
PI.slice(16, 20).show();
}
else if ($(this).hasClass('href-6')) {
PI.slice(20, 24).show();
}
else if ($(this).hasClass('href-7')) {
PI.slice(24, 28).show();
}
else if ($(this).hasClass('href-8')) {
PI.slice(28, 32).show();
}
else if ($(this).hasClass('href-9')) {
PI.slice(32, 36).show();
}
event.preventDefault();
}).filter(':first').click();
直播链接是一个伟大的*辅助*一个问题,但总是张贴有关代码*也在问题*中。两个原因。 1.人们不应该遵循链接来帮助你。 2. StackOverflow不仅适用于您,而且适用于将来也有类似问题的其他人。外部链接可以被移动,修改,删除等。通过确保相关代码在问题中,我们确保问题(及其答案)在合理的时间段内保持有用。 –
如果您转到徽标页面2,然后单击“全部”而不返回到页面1,则会返回此行为。 –