“如果windows.width小于”不起作用
“如果windows.width小于”不起作用
提问于 2015-01-15 12:53:31
我有这段代码，我正努力让它正常工作。
基本上，如果屏幕小于480 it宽，is会调整#page div的高度并垂直对其进行居中。否则，如果宽度更宽，只需垂直地对着它。
jQuery(document).ready(function(){
var wwidth = jQuery(window).innerWidth();
if (wwidth <= 480) {
function thirty_pc() {
var height = jQuery(window).innerHeight();
var thirtypc = ((95 * height) / 100) - 40;
var topmargin = (height - thirtypc - 40) / 2;
thirtypc = parseInt(thirtypc) + 'px';
topmargin = parseInt(topmargin) + 'px';
jQuery("#page").css('height',thirtypc);
jQuery("#page").css('margin-top',topmargin);
}
thirty_pc();
jQuery(window).bind('resize', thirty_pc);
} else {
function thirty_pc() {
var height = jQuery(window).innerHeight();
var pageheight = jQuery("#page").height()
var thirtypc = (height - pageheight - 60);
var topmargin = (thirtypc / 2);
thirtypc = parseInt(thirtypc) + 'px';
topmargin = parseInt(topmargin) + 'px';
jQuery("#page").css('margin-top',topmargin);
}
thirty_pc();
jQuery(window).bind('resize', thirty_pc);
}});但是，当windows.width小于480‘t时，它不会触发.不明白为什么。
回答 3
Stack Overflow用户
回答已采纳
发布于 2015-01-15 13:08:36
您必须在此之前绑定调整大小事件。
你的代码一团糟。请把它整理一下，这样你就能更快地看到虫子了。
试试这个：
jQuery(document).ready(function() {
function thirty_pc() {
var wwidth = jQuery(window).width();
if (wwidth <= 480) {
var height = jQuery(window).innerHeight();
var thirtypc = ((95 * height) / 100) - 40;
var topmargin = (height - thirtypc - 40) / 2;
thirtypc = parseInt(thirtypc) + 'px';
topmargin = parseInt(topmargin) + 'px';
jQuery("#page").css('height',thirtypc);
jQuery("#page").css('margin-top',topmargin);
console.log('under 480px');
} else {
var height = jQuery(window).innerHeight();
var pageheight = jQuery("#page").height();
var thirtypc = (height - pageheight - 60);
var topmargin = (thirtypc / 2);
thirtypc = parseInt(thirtypc) + 'px';
topmargin = parseInt(topmargin) + 'px';
jQuery("#page").css('margin-top',topmargin);
console.log('over 480px');
}
}
jQuery(window).bind('resize', thirty_pc);
});Stack Overflow用户
发布于 2015-01-15 13:22:46
roNn23发布的代码运行良好，很少(少量)更改，如下所示：
jQuery(document).ready(function() {
function thirty_pc() {
var wwidth = jQuery(window).width();
if (wwidth <= 480) {
var height = jQuery(window).height();
var thirtypc = ((95 * height) / 100) - 40;
var topmargin = (height - thirtypc - 40) / 2;
thirtypc = parseInt(thirtypc) + 'px';
topmargin = parseInt(topmargin) + 'px';
jQuery("#page").css('height',thirtypc);
jQuery("#page").css('margin-top',topmargin);
} else {
var height = jQuery(window).innerHeight();
var pageheight = jQuery("#page").height()
var thirtypc = (height - pageheight - 60);
var topmargin = (thirtypc / 2);
thirtypc = parseInt(thirtypc) + 'px';
topmargin = parseInt(topmargin) + 'px';
jQuery("#page").css('margin-top',topmargin);
}
}
thirty_pc();
jQuery(window).bind('resize', thirty_pc);
});现在，我试图删除一个垂直滚动发生在我的智能手机！
Stack Overflow用户
发布于 2015-01-15 13:34:18
这将触发窗口调整大小事件。使用window.innerWidth而不是jquery。
$(document).ready(function() {
$(window).on('resize', moveDiv);
});
function moveDiv() {
if (window.innerWidth < 481) {
//do something
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/27963944
复制相关文章
相似问题
腾讯云开发者
