11550 sujets

JavaScript, DOM et API Web HTML5

Bonjour tout le monde,

Voilà je voudrait faire un slide avec des images pour mon portefolio seulement après avoir fait le code javascript, la base HTML/CSS, je ne comprends pas il ne s'affiche pas.

Je débute en js c'est pourquoi mon erreur est sans doute toute bête...


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
     <title>P - RealBook - Etudiant</title>
     <meta name="description" content="Description de ma page web." />
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <meta http-equiv="Content-Language" content="fr" />
     <link href="real.css" rel="stylesheet" type="text/css" />
     <link href="slide.css" rel="stylesheet" type="text/css" />
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
     <script type="text/javascript">

$(document).ready(function(){
var current = 0 ;
var slidewidth = 560;
var slides = $('.slide') ;
var numeroslides = slides.length ;

// suppréssion de la scrollbar !
$('#contenu').css('overflow', 'hidden');

slides
.wrapAll('<div id="slideInner"></div>')
// Affichage horizontal des slides
.css ({
    'float' : 'left',
    'width': slideWidth
});

// Longueur totale des slides
$('slideshow')
.prepend('<span class="control" id="controlgauche">Suivant</span>')
.append('<span class="control" id="controldroit">Précédent</span>');

// Cacher la flèche de gauche si position 0
maganeControls(current);

function controlaff(position){
    // si position == 0 alors c'est le premier slide
    if(position==0) {$('#controlgauche').hide(); }
    else { $('#controlgauche').show();}
    if(position==numberOfSlides-1) {$('#controldroit').hide();}
    else { $('#controldroit').show(); }
}

manageControls(current);  

$('.control').bind('click',  function(){  
// do something when user clicks  
});

current = ($(this).attr('id')=='controldroit')  
? current+1 : current-1;
   
manageControls(currentPosition);
   
$('#slideInner').animate({  
'marginLeft' : slideWidth*(-current)
}
});
</script>
</head>

<!-- PAGE VALIDE XHTML Strict 1.0 -->

<body id="bg">


<div id="top">
<h1><a href="index.html"></a></h1>

<ul id="menu">
<li><a href="index.html">Home</a></li>
<li><a href="real.html">R&eacute;al'Book</a></li>
<li><a href="cv.html">Curiculum Vitae</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="apropos.html">A propos</a></li>
</ul>
</div>

<div id="content">

   <!------------------------- Slide ------------------------------->
<div id="slideshow">
    <div id="contenu">
        <div class="slide"> <!-- Slide n°1 -->  
        <h2>Premier slide</h2>
        <p><a href="http://www.pierre.fr"><img src="slide/essai1.png" width="190" height="145" alt="Première essai" /></a>TEXTE</p>
        </div>
        <div class="slide"> <!-- Slide n°2 -->
        <h2> Deuxième slide</h2>
        <p><a href="http://www.pierre.frr"><img src="slide/plfinal.png" width="190" height="145" alt="Première essai." /></a>TEXTE</p>
        </div> 
        <div class="slide"> <!-- Slide n°3 -->  
        <h2>Troisème slide</h2>
        <p><a href="http://www.pierre.fr><img src="slide/pl.png" width="190" height="145" alt="Première essai" /></a>TEXTE</p>
        </div>
        <div class="slide"> <!-- Slide n°4 -->  
        <h2>Quatrième slide</h2>
        <p><a href="http://www.pierrele"><img src="slide/carte.png" width="190" height="145" alt="Première essai." /></a>TEXTE !</p>
        </div> 
        </div>
    </div>
</div>
   <!------------------------- Slide ------------------------------->

</div>


<div id="footer">
Site web d&eacute;velopp&eacute; par Pier. <br />
2010-2011 - <a href="mailto:pier@free.fr">pierre@free.fr</a>
</div>


</body>
</html>



Voyez-vous une ou plusieurs erreurs ? Je commence à désespérer Smiley sweatdrop

Merci d'avance pour votre aide !


EDIT : heu, normal que mon code s'affiche tout en vert ? Smiley lol
Modifié par SedeL (02 Jan 2011 - 18:29)
Utilises tu un outil de déboguage ?
C'est indispensable. Tu peux utiliser par exemple firebug ou les outils de dev de chrome.

La console te renseignera sur d'éventuelles erreurs, en l'occurrence un oubli de parenthèse fermante.
Salut, tout d'abord merci pour ton aide,

Depuis le poste de mon message j'ai envi réussi à l'afficher. Merci quand même Smiley smile