5568 sujets

Sémantique web et HTML

Souci de lien qui ne fonctionne pas

Bonjour pour faire simple j'ai mon lien qui ne fait rien il réagit pas au clic besoin d'aide Smiley decu 


<html>
<header>
	<title>TOTO DANS L'ESPACE</title>
	<script type="text/javascript" src="./js/jquery-1.10.2.min.js"></script>
	<script type="text/javascript" src="./js/main.js"></script>
	<link rel="stylesheet" type="text/css" href="./css/style.css">
</header>

<body style="font-family : arial; ">
<section  style="background-color : #27B9FD"class="sect_test">
	<h4 class="h2_test">
	</h4>
    
    <h3>PIOPIO</h3>

	<div class="div_test">
		mon contenu
	</div> 
</section>

<section style="background-color : #2E2E2E" class="sect_test" id="la">
	<h4 class="h2_test">
	</h4>
    
    <h3>TONTON</h3>

	<div class="div_test">
		mon contenu
	</div> 
</section>

<section style="background-color : #27B9FD" class="sect_test">
	<h4 class="h2_test">
	</h4>
    
    <h3>TOTO</h3>

	<div class="div_test">
		<a href="./recherche/blabla.html" target="_blank">TOTO</a>
	</div> 
</section>

<section style="background-color : #2E2E2E" class="sect_test">
	<h4 class="h2_test">
	</h4>
    
    <h3>ZOZO</h3>

	<div class="div_test">
		mon contenu
	</div> 
</section>

<section style="background-color : #27B9FD" class="sect_test">
	<h4 class="h2_test">
	</h4>
    
    <h3>COCO</h3>

	<div class="div_test">
		mon contenu
	</div> 
</section>
<br /><br />
</body>
</html>



$(document).ready( function () {
 //   $(".sect_test div.div_test").hide();
    
    $(".sect_test").click( function () {
        var obj = $(this).closest('.sect_test').find('.div_test');
        if (obj.css('display') == 'none') var show = 1;
        else{ 
            show = 0; 
        //    $('div.div_test').hide();
            $(this).height("100px");
        }

        if (show) {
        	obj.show();
        	$(this).height("300px");
        }
        return false;
    });
} ) ;



a {text-decoration : none; color : #FFF; z-index: 20;}
body {color : #FFF;}
* {margin : 0; padding : 0;}
section {z-index: 10; height : 80px; text-align: center; }
div {z-index: : 1;}
Bonsoir,

tout d'abord, tout code HTML comporte plusieurs erreurs qui sont à corriger. Pour ce faire, tu as un outil qui t'aidera : le validateur du W3C.

Ensuite, quelques remarques :
- Il manque le doctype.
- Tu confonds les balises <header> et <head>.
- Attention à bien placer les balises <script> dans ta page HTML.
- Éviter autant que possible le CSS inline ; préférer l'utilisation d'une feuille de style externe.
- Pense à bien construire ta hiérarchie de titres.
- La balise <br /> est mal employée.
- 
* {margin: 0; padding: 0;}
est une mauvaise pratique. Si tu veux faire un reset CSS, fais-le correctement.
- Tu emploies incorrectement la propriété z-index. En effet, pour qu'elle produise un effet, il faut que l'élément auquel tu l'appliques soit positionné.

Enfin, pour ton souci avec le lien, la valeur de l'attribut href est-elle correcte ? Ton code Javascript ne serait-il pas à l'origine du problème ? (attendre d'autres avis)

N'oublie pas que de travailler avec un code valide c'est mieux. Smiley cligne
Modifié par jQzz (24 Oct 2013 - 02:57)
Ton lien <a> est un enfant d'une <section class="sect_test">.
Or dans le code javascript :
$(".sect_test").click( function () {
    [...]
    return false;
 });

On retourne false lorsqu'on clique sur la <section>.

Ainsi le click sur son enfant <a> a le même comportement, lorsqu'on clique dessus : rien ne se passe.

En espérant t'avoir aidé,
Ciseur
Sujet clos
Aller à