修改jQuery插件Columnizer

我試圖修改jQuery Columnizer插件，以在加載動態/託管內容的導航菜單上創建一個超級菜單效果。業務規則是菜單項應該默認爲2列（目前默認爲1），如果列的高度超過高度 - 在這種情況下，我將400px - 然後創建一個新列。如果它超過800像素，則創建第4列。修改jQuery插件Columnizer

我修改其在此處所示的Columnizer插件的源（I評論我與// jvirgo代碼）：http://screenquill.com/jquerytest/autocolumn.js並在此小提琴：

http://jsfiddle.net/P4wVV/

我的變形例是在這裏： // jvirgo

if (targetHeight() > 100) { 
numCols == 3; 
} 
if (targetHeight() > 200) { 
numCols == 4; 
}

但是，這完全破壞了柱化器的功能。我是否有不正確的語法，或者我的目標是高度錯誤的變量？

來源

2013-06-27 user2036584

我認爲你想要修改的變量是「options.columns」，而不是maxHeight。我可能會在你設置maxHeight變量之後立即進行修改，比你現在的位置高出幾行。這是未經測試：

$('div.subBody').each(function() { 
    var h = $(this).height(); 
    if (h > 100) { 
    var c = h > 200 ? 4 : 2; 
    $(this).columnize({columns:c}); 
    } 
});

不知道這是：

var maxHeight = $(this).height(); 
// mod 
if (maxHeight > 100) { options.columns = 2 } 
if (maxHeight > 200) { options.columns = 4 } 
// end mod 
var $cache = $('<div></div>');

你也從自己的功能，測量高度和葉columnizer未修改的（可能是其他地方使用該網站內）的調用columnizer這種情況下最好的代碼，但可能是我會採取的方法。

來源

2013-11-01 22:09:46 allQnoA

修改jQuery插件Columnizer

回答

相關問題