我想计算图标的数量,例如50px,具体取决于菜单窗口的宽度。 所以我开始:
$(window).width();
在使用文档就绪功能加载页面时,将给出宽度。 OK!
现在,我会在调整窗口大小时计算出适量的图标。
$(window).resize(function() {
//resize just happened, pixels changed
});
任务
每项任务都在运行,但我没有把它放在一起。
你可以帮我吗?>谢谢!!
如何计算窗口初始宽度和调整窗口大小时的图标数量?
我的开始:
var activeItemcount;
checkWidth();
$(window).resize(checkWidth);
function checkWidth() {
windowSize = $(window).width();
// console.log(windowSize);
var activeItemWidth = '100'; // width of the icons
var maxWidth = windowSize; // max div width on screen
activeItemcount = maxWidth / activeItemWidth; // max icon with actual screen width
activeItemcount = Math.round(activeItemcount) -1; // calculation
console.log(activeItemcount);
var i = '0';
$('.platform-view').each(function(){
if(i < activeItemcount ){
$(this).wrapAll('<div class="iconview-1" />');
i++;
}else{
$(this).wrapAll('<div class="iconview-2" />');
}
});
};
答案 0 :(得分:1)
我没有清楚地告诉你。 但是这段代码会在调整大小时返回窗口的可变宽度。
Jquery的: $(window).resize(function(){
$('#log').append('<div>'+$(window).width()+'</div>');
});
HTML:
实施例: A sample of the code
答案 1 :(得分:0)
将计算放入自己的函数中:
function calculateIcons()
{
var viewport = { width: $(window).width(), height: $(window).height() };
// Do cool things with viewport.width
}
然后你可以简单地将这个函数绑定到jQuery中的DOMReady和resize
函数,如下所示:
$(calculateIcons);
$(window).resize(calculateIcons);