This is only occurring on iPad iOS7. Works perfectly on iOS6
When I open the page on Portrait, topProducts.produtSliderEnable();
and topProducts.tabletThreeItems();
functions had been called.
But
When I open the page on Landscape, then I change to Portrait, nothing is called. Only when I do a click event on a element that belongs to a function I showed below, then both is called
enquire.register("(min-width: 768px) and (max-width: 979px)", {
match : function() {
topProducts.produtSliderEnable();
topProducts.tabletThreeItems();
},
unmatch : function() {
topProducts.productSliderDisable();
}
});
I have no clue why this is happening. Many thanks for any response.
==========================================
Functions if you want to look further, snipped out from my Literal Object
produtSliderEnable: function () {
if ($('.product-block .product-item').length === 4) {
nextToggle.show();
prevToggle.on('click', function () {
$(this).hide();
nextToggle.show();
container.animate({
left: "0"
});
productItem.removeClass('active');
productDetails.removeClass('active');
});
nextToggle.on('click', function () {
$(this).hide();
prevToggle.show();
container.animate({
left: "-203px"
});
productItem.removeClass('active');
productDetails.removeClass('active');
});
topProducts.swipeToggle();
}
},
productSliderDisable: function() {
if ($('.product-block .product-item').length === 4) {
nextToggle.hide().unbind();
prevToggle.hide().unbind();
container.css({
'left' : '0'
});
}
$('.product-block').attr('id', '');
},
tabletThreeItems: function() {
if (productItem.length === 3) {
$('.product-block').attr('id', 'threeItems');
}
}