Chrome无法在“刷新”上显示图像 [英] Chrome does not display images on Refresh

问题描述

我正在使用 roundabout jQuery插件，除了 Chrome 之外，它在所有浏览器上运行良好。

I am using roundabout jQuery plugin and it is working good on all browser except Chrome.

当我检查元素时，我发现所有源代码和参数都是正确且定义良好的。

When I Inspect Element, I find all source code and parameters are correct and well defined.

现在，当我点击URL并点击输入图像显示时以及当我刷新 F5 关键图片没有显示。

Now, when I click on URL and hit Enter images shows up and when i refresh with F5 key images are not displaying.

我尝试过研究谷歌和Chrome论坛，我无法理解......

I tried researching over Google and forums of chrome, i could not get that..

我当前的配置已经过测试

My current configuration tested on

Chrome  : Version 26.0.1410.64 m
OS      : Windows XP SP2, Windows 7 x86 Ultimate

以下是我尝试的一些训练，

And below are few workouts I tried,

1. Refreshed cache and deleted caches
2. Images path are correct
3. Making header content-type to text/html, text/css, and content-length to 1024
4. Used Other operating system and previous version of chrome
5. checked console if there any errors in JavaScript (Result : empty console, i.e. No Errors or warnings)

我添加了一张图片仅供参考（可能没用）

And i have added an image just for reference (may not be helpful)

<ul id="treemenu1" class="r-ul">
    <li><img src="images/img/img1.png"  /></li>

    <li><img src="images/img/img3.png" /></li>
    <li><img src="images/img/img2.png" /></li>
    <li><img src="images/img/img4.png"  /></li>

    <li><img src="images/img/img5.png"  /></li>
    <li><img src="images/img/img6.png"  /></li>
    <li><img src="images/img/img7.png"  /></li>

    <li><img src="images/img/img9.png"  /></li>
    <li><img src="images/img/img10.png"  /></li>
    <li><img src="images/img/img11.png"  /></li>
</ul>   


<script>
    $(document).ready(function() {
        $('ul').roundabout({
            'autoplay':true,
            'duration':3000
        });
    });
</script>

添加了jsfiddle

http://jsfiddle.net/Twy8e/

并且theres没有问题是jsfiddle工作在chrome ..并且它在chrome上工作..但是在生产中它不显示图像

And theres no problem is jsfiddle working on chrome.. and its working on chrome.. but when i n production it doesnot display images

推荐答案

哦，我甚至使用了这个插件和很多问题，最后我得到了解决方案。

Oh, I even used this pluggin and lot of problem and finally i got the solution.

设置参数
'debug'：true
，你会看到所有款式/ css的空div元素。

set a paramenter 'debug':true and you will see empty div elements with all styles/css.

$(document).ready(function() {
    $('ul').roundabout({
        'autoplay':true,
        'duration':3000,
        'debug':true
    });
});

现在当你刷新时，看到样式/ css然后你会发现
height 和 width div 元素 0px 。

Now when you refresh, see the style/css then you will find height and width of div elements as 0px.

并设置 min-height 和 min-重量到下面提到的css或你想要的值并检查出来..

And set min-height and min-weight to css mentioned below or values you want and check that out..

我看到你小提琴，我认为..这个css

I have seen you fiddle, i think that.. this css

li img {
    width: 100%;
}

您需要将其更改为

li img {
    min-height: 250px; /* or whatever */
    min-weight: 350px; /* or whatever */
}

解决后，删除调试选项或设置这是假的。

And after you resolve, remove debug option or set it to false.

可能这对你有用，因为我遇到了这个问题并得到了解决方案。我认为它不是chrome的问题..
它的插件不会触发 height 和 width 元素

May be this should work for you, as i have got this problem and got the solution. I think its not the problem of chrome.. its pluggin thats not triggering the height and width of elements

这篇关于Chrome无法在“刷新”上显示图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！