Jquery:fadein功能不起作用

Question

我正在关注图像滑块的jquery视频教程.这就是我在HTML中的内容

   <div id="slider">
     <img id="1" src="images/1.jpg" alt="" > 
     <img id="2" src="images/2.jpg" alt="" /> 
     <img id="3" src="images/3.jpg" alt=""/>
     <img id="4" src="images/4.jpg" alt=""/>
   </div>

css图像

#slider >img{
    width: 960px;
    height: 300px;
    display: none;
    float: left;
 }

我希望在页面加载时淡出第一张图像

$(function(){
      $("#slider>img>#1").fadeIn(3000);
  });

但这不起作用.我检查过jquery文件也完全包含在我的源代码中.请有人帮帮我

Answer 1

图片标签<img>不能有子项,因此>选择器没有任何意义.正确的代码是:

$("#slider>img#1").fadeIn(3000);

另一件事.尽管数字ID是有效的HTML5标识符,但最好还是坚持使用更传统的标识符,image-1例如旧版浏览器:

<img id="image-1" src="images/1.jpg" alt="" >