veuillez m'aidez pour la correction de ce code
merci
<!DOCTYPE html >
<html lang="fr">
<head>
<title>article </title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="" />
<meta name="author" content="" />
<link rel="stylesheet" type="text/css" href="style/nivo.css" />
<link rel="stylesheet" type="text/css" href="style/article2.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="js/article2.js"></script>
<script src="js/js.js"></script>
<script type="text/javascript">
</script>
</head>
<body>
<div id="total">
<div class="bloc">
<div class="title">
Mon Titre
<div class="tabs" id="tabs1">
<a href="#contenu1">contenu 1</a>
<a href="#contenu2">contenu 2</a>
<a href="#contenu3">contenu 3</a>
</div>
</div>
<div class="content"></div>
<div id="contenu1">
<h1>Titre 1</h1>
<p> La partie électrique et le photovoltaïque m'ont le plus interessé. Le style de la formation très concrète et très imagée et documentée grâce au vécu du formateur. Très bien, petit effectif et pluralité des participants. L'intendance est parfaite, très bonne attention du personnel aux stagiaires
</p>
</div>
<div id="contenu2">
<h1>Titre 2</h1>
<p> Le style de la formation très concrète et très imagée et documentée grâce au vécu du formateur. Très bien, petit effectif et pluralité des participants. L'intendance est parfaite, très bonne attention du personnel aux stagiaires
</p>
</div>
<div id="contenu3">
<h1>Titre 3</h1>
<p> Très bien, petit effectif et pluralité des participants. L'intendance est parfaite, très bonne attention du personnel aux stagiaires
</p>
</div>
</div>
</div>
</body>
</html>
@charset "utf-8";
/* CSS Document */
html{font-size:100%;
width: ;}
.bloc .title{
height: 50px;
color: #FFF;
background-color:blue ;
width: 100%;
position:relative;
font-size: 20px;
}
.title a{
color: #FFF;
}
.bloc .tabs{
position:absolute;
right: 0;
bottom:0;
}
.bloc .tabs a{
display: inline-block;
color: white;
text-decoration: none;
font-size: 20px;
bottom: 10px;
padding: 0 10px 15px 10px;
font-weight: normal;
line-height: 20px;
border-radius:10px 10px 0 0 ;
}
.bloc .tabs a:hover, .bloc .tabs a.active{
background-color: #FFF;
color: #000;
}
/*
LORSQUE l'on clique sur un onglet
*On retire la class active de l'onglet actif
*j'ajoute la class active à l'onglet actuel
*On retire la class active sur l'onglet actif
j'ajoute la class active sur le contenu correspond à mon clic
*/
alert('test');
jQuery(function($){
var anchor = window.location.hash;
$('.tabs').each(function(){
var current = null;
if(anchor != ''&& $(this).find('a[href="'+current+'"]').lenght > 0){
current = anchor;
}else{
current = $(this).find('a:first').attr('href');
}
$(this).find('a[href="'+current+'"]').addclass('active');
$(current).siblings().hide();
$(this).find('a').click(function(){
var link= $(this).attr('href');
if(link == current){
return false;
}else{
$(this).siblings().removclass('active');
$(this).addclass('active');
$(link).show().siblings().hide();
current=link;
}
});
});
});
merci