何らかの理由で Javascript がランダムに動作しなくなります。
高さの問題を扱っているコード:
$(document).ready(function()
{
/*setEqualHeight($("ul#product_list li"));*/
//alert("some text");
/*setEqual($("ul#product_list"));*/
//var i = 2;
//alert($('ul#product_list li:nth-child('+ (i + 2) +')').height()); //this is correct way to get value*/
var elements = $('ul#product_list li').length; //this is correct way to get value
/*var liekana = elements % 3;
elements = elements - liekana;
alert(elements);*/
for(var i = 1; i <= elements; i = i + 3)
{
var first = $('ul#product_list li:nth-child('+ (i) +')').height();
var second = $('ul#product_list li:nth-child('+ (i + 1) +')').height();
var third = $('ul#product_list li:nth-child('+ (i + 2) +')').height();
var tallest = 0;
if (first > second)
if (first > third)
{
tallest = first;
}
else
{
tallest = third;
}
else
if (second > third)
{
tallest = second;
}
else
{
tallest = third;
}
$('ul#product_list li:nth-child('+ (i) +')').height(tallest);
$('ul#product_list li:nth-child('+ (i + 1) +')').height(tallest);
$('ul#product_list li:nth-child('+ (i + 2) +')').height(tallest);
/*if (!third)
alert("yra");*/
}
});
失敗した URL: http://piguskompiuteris.lt/6_asus 通常のレンダリング URL: http://piguskompiuteris.lt/16-lenovo
この問題を解決する方法についての提案は大歓迎です。ありがとう
更新 2. JavaScript コードを書き直しました...それでも同じランダム エラーが発生し、グリッドが崩壊することがあります。何が原因かわかりません。
考えられる原因: 1) 高さ属性が小さすぎて、高さ + パディング + マージン + 境界線が含まれていない 2) 関数の配置 (現在はヘッダーにない) または呼び出しに問題がある