0

我正在使用roundaboutjQuery 插件，它在所有浏览器上运行良好，除了Chrome.

当 I 时Inspect Element，我发现所有源代码和参数都是正确且定义明确的。

现在，当我单击 URL 并点击Enter图像时，当我用关键图像刷新时F5没有显示。

我尝试通过谷歌和 chrome 论坛进行研究，但我无法得到那个..

我当前的配置在

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

以下是我尝试过的一些锻炼，

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)

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

在此处输入图像描述

更新：代码

<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/

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

4

4 回答 4

1

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

设置一个参数 'debug':true ，您将看到具有所有样式/css 的空 div 元素。

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

现在，当您刷新时，请查看样式/css，然后您会发现 height和元素width为.div0px

并设置min-height并设置min-weight为下面提到的 css 或您想要的值并检查一下..

我见过你小提琴，我认为..这个css

li img {
    width: 100%;
}

您需要将其更改为

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

解决后，删除调试选项或将其设置为 false。

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

于 2013-04-24T11:26:59.387 回答
0

使用并尝试 Tilled Characters 或 ../

 <li><img src="~/images/img/img1.png"  /></li>

或者

 <li><img src="../images/img/img1.png"  /></li>

并看到其他一些讨论

CSS背景图像未加载

Chrome：刷新页面+ javascript重定向后未呈现背景图像

或 使用 $(window).load() 而不是 $(document).ready()

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

    });
</script>
于 2013-04-24T05:34:14.930 回答
0

<li><img src="images/img/img3.png?X" /></li>当您从服务器端生成图像时，尝试将随机数添加到图像源中，就像X随机数一样。

例如：

<li><img src="images/img/img3.png?1" /></li>
<li><img src="images/img/img2.png?2" /></li>
<li><img src="images/img/img4.png?3" /></li>
于 2013-04-24T05:34:35.403 回答
0

我最近确实遇到了从服务器端加载图像的相同问题，我对代码进行了一些更改，但似乎没有任何帮助。

所以我做了一个改变图像文件类型的小技巧，png to jpeg一切都从那里顺利进行。

于 2013-04-24T11:56:51.213 回答