Tag: 调整

使用jQuery调整父元素的高度以匹配其可见子元素的高度: 我有一个幻灯片在容器中运行，需要容器的高度来匹配可见幻灯片的高度。不幸的是，图像绝对定位，我无能为力。为了解决这个问题，我正在使用一些jQuery魔法来处理相同的function。出于某种原因，我的代码无效。每当调整#container元素的大小时，函数就会运行，并且应该将#main的高度调整为与可见幻灯片相同的值。但是，呃..没有bueno。我的控制台中没有显示任何错误。思考？ http://jsfiddle.net/danielredwood/2G4ky/3/ 幻灯片插件： http ： //jquery.malsup.com/cycle/ HTML： CSS： #container { max-width:960px; } #main { max-width:780px; height:520px; margin:0 auto 40px; overflow:hidden; background:#ccc; } #main img { width:100%; height:auto; } JavaScript的： $(‘.home’).cycle({ fx:’fade’ }); $(‘#container’).resize(function(){ var child_height = $(‘.slide:visible’).height(); $(‘#main’).css(‘height’, child_height); });

根据窗口大小调整页面元素的大小: 问题：我的客户希望我为他的产品创建一个启动网页，以便页面上不应该滚动任何浏览器或窗口尺寸。怀疑：这可能使用CSS和Javascript吗？一些早期诊断：这可能与此或此类似，但区别在于我想以特定比例调整每个元素的尺寸，而不仅仅调整父DIV的高度。所以，声明：我需要根据（当前窗口大小和参考窗口大小）之间的比率更改每个元素（图像，div，文本…所有）的尺寸。也许Javascript可以解决这个问题？问题：怎么做？

根据屏幕大小替换HTML: 我试图以小屏幕尺寸替换HTML内容，然后在窗口再次变大时替换它。我的代码可以使用，但如何删除更改呢？这是我到目前为止的代码： $(window).resize(function() { if (window.innerWidth < 480) { $('.LatestNews').replaceWith('News Link’); } else if (window.innerWidth > 480) { // Change back to original .LatestNews } }).resize(); 谢谢。

使用jquery更改图像尺寸: 我在div id myimage下有一个图像。现在我想通过改变来调整它的大小。我想从选择框700X7000选择框，然后图像的尺寸将是高700px和宽700px。没有重新加载页面。任何人都可以帮我，我该怎么做？

移动图像或按窗口resize？: 我的html中有一个“拉伸”类的图像。目前，使用css，此图像会重新resize，因为窗口重新resize为屏幕宽度的100％。当窗口被重新resize时，我也希望它向上移动。我假设这可以用jQuery完成，但我不太确定。基本上，“顶部”css值只需要随着屏幕宽度的变化而变化。这是目前正在重新调整它的css： .stretch { width: 100%; height: auto; min-height: 420px; position: absolute; top: -200px; } 谢谢，涉

确定浮动元素中的换行位置: 假设我在容器有六个元素。这六个div中的每一个都是一个正方形，并且CSS样式为float: left applied。默认情况下，当它们到达容器的边缘时，它们将换行。现在，我的问题是，使用Javascript，是否可以确定包装在哪个元素？如果它们在页面上显示如下： ___ ___ | 1 | | 2 | —– —– ___ ___ | 3 | | 4 | —– —– 我试图确定包裹发生在第二个和第三个元素之间。如果你想知道我是否已经失去了理智，我试图这样做的原因是如果点击其中一个框，我希望能够通过一些花哨的shQueryy jQuery下拉行之间的信息区域。 ___ ___ | * | | ! | —– —– | Someinfo| ___ ___ | * | | * | —– —– […]

尝试使用jquery循环幻灯片显示窗口大小调整: 我正在尝试在带有jQuery循环幻灯片的页面上运行JavaScript窗口resize脚本但是我遇到了一些我似乎无法解决的错误。它会在页面加载时调整第一个图像的大小，但会忘记后续幻灯片的新高度/宽度属性。我可以在使用jQuery之前和之后再次设置这些，但在resize之前，图像总是以全尺寸闪烁一小段时间。 jQuery.cycle是否将幻灯片调整为原始大小？如果是这样，我该怎么做呢？ $(document).ready(function () { $(‘.slideshow’).cycle({ fx: ‘fade’, speed: 200, timeout: 1000, pause: 1, before: function (currSlideElement, nextSlideElement, options, forwardFlag) { resize(); }, after: function (currSlideElement, nextSlideElement, options, forwardFlag) { resize(); } }); $(‘.slideshow’).find(‘img’).css(“height”, “0”); $(‘#image’).hide().idle(1000).fadeIn(); resize(); }); $(window).resize(function () { resize(); }); function resize() { var theheight = window.innerHeight; var thewidth […]

高度（）和resize（）的Jquery问题: 我需要根据文档的高度为元素指定一个特定的高度，并保持文档大小的变化： $(document).ready(function () { $(‘#descriptive_news_text’).height(($(document).height() – 325)); $(window).resize(function () { $(‘#descriptive_news_text’).height(($(document).height() – 325)); }); }); 现在，当我手动调整浏览器的大小时，它就像一个魅力，但在页面加载时，文档大小的计算方式是错误的，因此div的高度也是错误的。我试图强制$(windows).resize()作为最后一个语句（作为测试，即使有几秒的延迟），但这不起作用，因为jQuery在手动resize后才识别正确的高度。此外，通过双击或通过窗口（Chrome，Windows）的“resize”按钮调整窗口大小，它似乎不会像拖动窗口边缘那样触发“resize”事件。有帮助吗？

如何检测jquery中的文档大小更改: 所以假设单击某些内容会导致新内容被加载到屏幕上，因此文档的高度会发生变化，而之前没有滚动条，现在实际上有滚动条… 我如何检测使用jquery发生的事情绑定resize事件到窗口只检测窗口resize，而将其绑定到文档不起作用

使用带有coffeescript的jquery fileupload – 在使用add callback时调整图像大小: 已解决它certificate了在应用程序中加载的js的顺序.js是错误的： original: //= require jquery-fileupload/jquery.fileupload-process //= require jquery-fileupload/jquery.fileupload-image //= require jquery-fileupload/jquery.fileupload-validate correct version: //= require jquery-fileupload/jquery.fileupload-process //= require jquery-fileupload/jquery.fileupload-validate //= require jquery-fileupload/jquery.fileupload-image 我正在尝试使用BlueImp的jquery文件上传器，我已经设法让一切正常但resize。我正在尝试调整添加回调上的图像大小，然后提交以避免任何服务器端处理。我知道使用add回调会导致跳过进程函数，但是我在add回调本身中手动调用了它，它应该可以工作，但事实并非如此。这是我的代码： $(‘.jquery-fileupload’).fileupload dataType: “script” imageMaxWidth: 480 imageMaxHeight: 360 disableImageResize: false autoUpload: false process:[ { action: ‘load’, fileTypes: /^image\/(gif|jpeg|png)$/, maxFileSize: 20000000 }, { action: ‘resize’, maxWidth: 480, // the images are […]