Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/user-interface/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
简单的Jquery滑块无法加载带有.show的图片_Jquery_User Interface_Slider - Fatal编程技术网

简单的Jquery滑块无法加载带有.show的图片

简单的Jquery滑块无法加载带有.show的图片,jquery,user-interface,slider,Jquery,User Interface,Slider,我按照教程做了一个T恤,但我就是无法让它工作,它加载了加载的gif并隐藏了其他图像,但这个。显示功能没有任何作用,我遗漏了什么吗 <style type="text/css"> .slider{ width:800px; height:350px; overflow:hidden; margin:30px auto; background-image:url(img/load.gif); background-repeat:no-repeat; background-position

我按照教程做了一个T恤,但我就是无法让它工作,它加载了加载的gif并隐藏了其他图像,但这个。显示功能没有任何作用,我遗漏了什么吗

<style type="text/css">
.slider{
width:800px;
height:350px;
overflow:hidden;
margin:30px auto;
background-image:url(img/load.gif);
background-repeat:no-repeat;
background-position:center;
}
.shadow{
background-image:url(img/shadow.png);
background-repeat:no-repeat;
background-position:top;
width:864px;
height:144px;
margin:-60px auto;
}
.slider img{
width:800px;
height:350px;
display:none;
}
</style>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery-ui/1.8.22/jquery-ui.min.js"></script>
<script type="text/javascript">

function Slider(){
    $(".slider #1").show("fade",500);
}

</script>
</head>

 <body onload="Slider();">
<div class="slider">
    <img id="1" src="img/image1.jpg" border="0" alt="Image 1"/>
    <img id="2" src="img/image2.jpg" border="0" alt="Image 2"/>
    <img id="3" src="img/image3.jpg" border="0" alt="Image 3"/>
</div>
<div class="shadow">
</div>
</body>

.滑块{
宽度:800px;
高度:350px;
溢出:隐藏;
保证金:30像素自动;
背景图片:url(img/load.gif);
背景重复:无重复;
背景位置:中心;
}
.影子{
背景图片:url(img/shadow.png);
背景重复:无重复;
背景位置:顶部;
宽度:864px;
高度:144px;
保证金:-60px自动;
}
.滑块img{
宽度:800px;
高度:350px;
显示:无;
}
函数滑块(){
$(“.slider#1”).show(“淡入淡出”,500);
}
替换
$(“.slider.1”)。显示(“淡入”,500)带有
$(“.slider#1”).fadeIn(500)


如果一个id属性不能只是一个数字(或以数字开头),可能这在html5中已经改变了。这是新的还是一直都是这样做的?我知道该教程是在UI 1.8.18期间编写的,您在哪里学习如何正确实现此功能?因为现在我注定要这样做。隐藏(“幻灯片”),左或什么的一直是做这件事的方式。您可以使用
$(“.slider.1”).show(500)也是。查看jQuery文档。