2012-08-02 2 views
0

J'ai suivi un tutoriel à un tee-shirt, mais je ne peux tout simplement pas le faire fonctionner, il charge le gif de chargement et cache les autres images, mais cette fonction .show ne fait rien, suis-je manquant quelque chose?Simple curseur Jquery ne charge pas d'image avec .show

<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> 
+0

id-AFAIK un attribut ne peut pas juste être un numéro (ou commencer par un chiffre), peut-être cela a été changé en html5. – ninja

Répondre

0

Remplacer $(".slider #1").show("fade",500); avec $(".slider #1").fadeIn(500);

http://jsfiddle.net/Ty7ce/

+0

Est-ce nouveau ou cela a toujours été la façon de le faire? Je sais que le tutoriel était pendant l'interface utilisateur 1.8.18 où apprenez-vous comment implémenter correctement cela? parce que maintenant je voulais l'avoir. masquer ("glisser",) gauche ou autre – user1571659

+0

Cela a toujours été le moyen de le faire. Vous pouvez utiliser '$ (". Slider # 1 "). Show (500);' ainsi. Consultez la documentation de jQuery. http://api.jquery.com/show/ –