Jquery加载程序gif顺序加载

Jquery加载程序gif顺序加载,jquery,sequence,loader,gif,Jquery,Sequence,Loader,Gif,我想做的是有一个ajax加载程序gif,显示图像,然后按顺序加载到页面中 所以它是这样工作的 ajax加载程序显示-图像淡出-ajax加载程序淡出-然后转到下一个图像 ajax加载程序显示-图像淡出-ajax加载程序淡出-然后转到下一个图像 ajax加载程序显示-图像淡出-ajax加载程序淡出-然后转到下一个图像 ajax加载程序显示-图像淡出-ajax加载程序淡出-然后转到下一个图像 一直做下去 这是我的密码 <ul id="clients"> <li><i

我想做的是有一个ajax加载程序gif,显示图像,然后按顺序加载到页面中

所以它是这样工作的

ajax加载程序显示-图像淡出-ajax加载程序淡出-然后转到下一个图像

ajax加载程序显示-图像淡出-ajax加载程序淡出-然后转到下一个图像

ajax加载程序显示-图像淡出-ajax加载程序淡出-然后转到下一个图像

ajax加载程序显示-图像淡出-ajax加载程序淡出-然后转到下一个图像

一直做下去

这是我的密码

 <ul id="clients">
  <li><img src="images/logos/clients_03.jpg" width="242" height="152" alt="Taylor Woodrow" /></li>
  <li><img src="images/logos/clients_04.jpg" width="242" height="152" alt="BG Group" /></li>
  <li><img src="images/logos/clients_05.jpg" width="242" height="152" alt="Canon" /></li>
  <li><img src="images/logos/clients_06.jpg" width="227" height="152" alt="department" /></li>
  <li><img src="images/logos/clients_08.jpg" width="242" height="164" alt="disney" /></li>
  <li><img src="images/logos/clients_09.jpg" width="218" height="164" alt="xts" /></li>
  <li><img src="images/logos/clients_10.jpg" width="223" height="164" alt="fisevr" /></li>
  <li><img src="images/logos/clients_11.jpg" width="227" height="164" alt="hilti" /></li>
</ul>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js" type="text/javascript"></script>
<script>
$("ul#clients li").append('<img id="show" src="images/ajax-loader.gif" width="32" height="32" alt="fvdsv" />');
  $("ul#clients li:eq(0)").show("fast", function () {
    /* use callee so don't have to name the function */
    $(this).next("ul#clients li").fadeIn("slow", arguments.callee);

  });
$(“ul#clients li”)。附加(“”); $(“ul#clients li:eq(0)”)。显示(“快速”,函数(){ /*使用被调用方,因此不必命名函数*/ $(this.next(“ul#clients li”).fadeIn(“slow”,arguments.callee); });

所以它可以正常工作,但是ajax加载器总是显示任何帮助


谢谢

首先,您在img中有id=show,并将其附加到所有不适合HTML的图像上。ID应该是唯一的

如果要在加载图像时显示ajax gif,以及在加载图像后显示图像并隐藏gif,则应使用以下方法:

  • 将类“images”添加到要首先加载的图像中,并在其中添加样式display:none
  • 然后将ajax GIF直接添加到这些图像之后的html中(或者您可以像在示例中那样执行)
使用以下代码:

 $('ul#clients li img.images').load(function() {
   $(this).next().fadeOut();
   $(this).fadeIn();
 } );

一直在播放,你的意思是它最后没有被删除,你需要想出一种方法在没有图像时删除它吗?