Question

我对js相对较新，因为我的生活无法弄清楚这个功能的问题。我只是想在页面调整大小时调整div的宽度。如果css与它有任何关系，也包括在内。

<div id="lowerPattern"></div>


<script>
    $( window ).bind("resize", function() {
        // Change the width of the div
        $("#lowerPattern").css('width', '300px');
    });
</script>


/*CSS*/
#lowerPattern {
    height: 99px;
    width: 10px;
    background-color: green;
    /*Keeps div centered on resize*/
    position: absolute;
    left: 50%;
    margin-left: -300px;
}

Answer 1

这对我来说很好：http://jsfiddle.net/kuaYV/

您确定JQuery正确加载吗？另外，尝试将函数放在$(document).ready()中，如下所示：

$(document).ready(function() {
    $( window ).bind("resize", function(){
        // Change the width of the div
        $("#lowerPattern").css('width', '300px');
    });
});

编辑：如果它仍然不起作用，它可能与父元素的CSS有关。另外，请确保页面上没有任何其他具有相同id属性的元素。

Answer 2

将您的代码包含在$（document）.ready（function（）{}）中;像这样：

$(document).ready(function()
{
    $( window ).bind("resize", function(){
// Change the width of the div
$("#lowerPattern").css('width', '300px');
});
});

Answer 3

你知道你必须加载Jquery吗？您必须将jquery源代码放入文件中，并在每次使用CDN（Contact Delivery网络）运行网站时将其保存或下载。

此外，您必须加载Jquery。转到他们的网站并下载源代码。保存到扩展名为.js的文本文件。之后写

<script type="text/Javascript" src="MyJquery.js"></script>

在HTML的头部区域

另一种选择是使用CDN并写：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">
</script>

这会将jquery加载到您的网站

您必须将代码放入

（文档）$。就绪（函数（）{

//将所有代码放在这里

}）;

如果您使用CDN，请检查您的网络连接。如果互联网连接丢失，则在您尝试运行时不会加载Jquery

JavaScript调整div的麻烦

3 个答案: