在chrome上的Jquery width()函数在加载和重载(F5)时给了我不同的值。

Question

我不知道是怎么回事，但我的菜单是这样设置的。

<div class="indice_item activo">
<div class="indice_item">
<div class="indice_item">
<div class="indice_item">
<div class="indice_item">
<div id="puntero" style="width: 180px; height: 19px; top: 70px; left: 0px; background-color: rgb(10, 173, 247);">&nbsp;</div>

问题是div.puntero是一个div，当鼠标悬停在不同的indice_item上时，它就会跟着鼠标走。我是用jquery和它的函数animate来实现的。当页面加载时，它创建了这个div.puntero，它寻找这个菜单的第一个项目，并获得宽度和上下左右的坐标，所以它可以设置div.puntero在有类 activo的项目下。

这就是实现这一功能的代码

/*
 * Seleccionado el primero activo 
 */
$(document).ready(function() {
    $('div.indice_item').last().after('<div id="puntero">&nbsp;</div>');
    //seteamos el puntero donde debe estar
    ancho=$('div.indice_item').first().width()
    alert(ancho);
    $('#puntero').width($('div.indice_item').first().width());
    $('#puntero').height(($('div.indice_item').first().height()+3));
    $('#puntero').css({
        "top"  : $('div.indice_item').position().top,
        "left" : $('div.indice_item').position().left
    });
    $('.indice_item').each(function (){
        //$(this).
    });
});

这在firefox中完美的工作，但在chrome中，我有几个问题，它似乎工作正确。 但后来我按下重新加载或F5和div.puntero的宽度去疯狂.我添加了警报（ancho）;的宽度，当我去的页面，它给了我正确的宽度180，当我按下重新加载1665或1649，的图表.为什么它的工作是这样的？

Answer 1

试着在所有东西加载完毕后设置高度和宽度，即使用 $(window).load(function() {//set height and width here});.

我相信在firefox中似乎可以正常工作，因为有缓存。也许我错了，只要设置好jsFiddle。这样就能更容易的找出问题所在了。

Answer 2

这里是解决方案。

在Chrome浏览器中，jQuery在页面刷新（F5）后出现了奇怪的现象。

用这个

$(window).load(function() {});

出，而不是。

$(document).ready(function() {})。