Bonjour,
je réalise un portfolio grâce à un template html css et j'ai un problème avec les liens et ancrages.
La page index fonctionne bien, les liens du menu mènent bien aux parties des pages que je veut.
Toutefois, pour les autres pages présentant chaque projet, les liens du menu ne fonctionne pas. je souhaiterais que lorque l'on clique sur le logo on revienne sur la page index, lorsque l'on clique sur "A propos" on revienne sur la partie "A propos" de la page index.
Voici le code de la page où les liens et ancrages du menu ne redirige pas vers la page index ou des sections de cette page :
Merci d'avance et bon dimanche !
Modifié par stephrbl (02 Oct 2016 - 16:17)
je réalise un portfolio grâce à un template html css et j'ai un problème avec les liens et ancrages.
La page index fonctionne bien, les liens du menu mènent bien aux parties des pages que je veut.
Toutefois, pour les autres pages présentant chaque projet, les liens du menu ne fonctionne pas. je souhaiterais que lorque l'on clique sur le logo on revienne sur la page index, lorsque l'on clique sur "A propos" on revienne sur la partie "A propos" de la page index.
Voici le code de la page où les liens et ancrages du menu ne redirige pas vers la page index ou des sections de cette page :
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]> <!-->
<html lang="en">
<!--
<![endif]-->
<head>
<!-- TITLE OF SITE -->
<title>Stéphanie Reboul</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="Fort Multipage Landing Page" />
<meta name="keywords" content="Fort, parallax, one page, multipage, responsive, landing, html template" />
<meta name="author" content="Theme View">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- Favicons -->
<link rel="icon" type="image/png" href="images/favicon.ico">
<link rel="apple-touch-icon" href="images/apple-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-icon-114x114.png">
<!-- CSS Begins
================================================== -->
<!-- Google Font And Custom Font Begins -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Merriweather' rel='stylesheet' type='text/css'>
<!-- FONT ICONS -->
<!-- font-awesome -->
<link href="css/font-awesome.min.css" rel="stylesheet">
<!-- IonIcons -->
<link href="icon/ionicons/css/ionicons.css" rel="stylesheet">
<!-- Elegant Icons -->
<link href="icon/elegant-icons/style.css" rel="stylesheet">
<!--/ FONT ICONS -->
<!--Animate Effect-->
<link href="css/animate.css" rel="stylesheet">
<link href="css/hover.css" rel="stylesheet" >
<!--lightbox-->
<link href="css/lightbox.css" rel="stylesheet">
<!--Owl Carousel -->
<link href="css/owl.carousel.css" rel="stylesheet">
<link href="css/owl.theme.css" rel="stylesheet">
<link href="css/owl.transitions.css" rel="stylesheet">
<!--BootStrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/vendor/modernizr-2.6.2.min.js"></script>
<link href="css/normalize.css" rel="stylesheet">
<!-- Main Style -->
<link href="css/style.css" rel="stylesheet">
<link href="css/responsive.css" rel="stylesheet">
<!--DEFAULT COLOR/ CURRENTLY USING , Replace Your Color-->
<link rel="stylesheet" href="css/colors/bleu.css">
<!--Replace Your Color Ends-->
<!-- Template Demo Color Examples -->
<!--Moderate Orange Color
<link rel="stylesheet" type="text/css" href="css/colors/moderate_orange.css"/>
-->
<!--Green Color
<link rel="stylesheet" type="text/css" href="css/colors/green.css"/>
-->
<!--Yellow Color
<link rel="stylesheet" type="text/css" href="css/colors/yellow.css"/>
-->
<!-- END Template Color Demo Examples -->
</head>
<body>
<!-- Start: Header Section
=============================================-->
<!-- nav -->
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header page-scroll">
<button class="navbar-toggle" data-target="#bs-example-navbar-collapse-1" data-toggle="collapse" type="button">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html">
<!-- LOGO -->
<img class="logo" alt="logo" src="images/logo10.png">
</a>
</div><!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse single-page-nav" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-left">
<li>
<a href="index.html">Home</a>
</li>
<li>
<a href="index.html#about-section">A propos</a>
</li>
<li>
<a href="index.html#work">Projets</a>
</li>
<li>
<a href="index.html#contact">contact</a>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav><!-- /. nav -->
<!-- header -->
<header id="page-top">
<div class="container">
<div class="row">
<div class="col-lg-12 col-xs-12 col-sm-12 col-md-12 ban1_txt wow fadeInUp" data-wow-delay="0.5s">
<!-- Header Introduction -->
<h2>Découvrez</h2>
<h3>Mon Travail </h3>
<!-- /. Header Introduction -->
</div><!-- /. col-lg-12 -->
</div><!-- /. row -->
</div><!-- /. container -->
<div id="particles-js"></div><!-- header video -->
</header><!--/. header -->
<!-- End: Header Section
==================================================-->
<!-- Single Portfolio
==================================================-->
<section class="container-fluid no-padding page-content">
<div class="container">
<div class="row">
<!-- portfolio item -->
<div class="col-lg-9 col-md-9 col-sm-8 col-xs-12">
<div class="portfolioitem">
<a href="#"><video controls src="video/sicile.mp4" iframe width="848" height="500"></a>
</div>
</div>
<!--/ portfolio item -->
<!-- Widget Area -->
<div class="col-lg-3 col-md-3 col-sm-4 col-xs-12 itemPortfolioContent">
<div class="defaultProjectDetails">
<p></p>
<span><i class="fa fa-info"></i> </span>
<span>PROJET</span>
<h7>SICILE</h7>
</div>
<br></br>
<div class="defaultProjectDetails">
<span><i class="fa fa-clock-o"></i> </span>
<span>DATE</span>
<h6>2016</h6>
</div>
<div class="defaultProjectDetails">
<span><i class="fa fa-tag"></i> </span>
<span>CATEGORIE</span>
<h6>Vidéo </h6>
</div>
<div class="contectSec">
<p>Vidéo personnelle réalisée à la suite d'un voyage en Sicile.</p>
</div>
</div>
</div><!-- row /- -->
</div><!-- Container /- -->
</section>
<!-- End: Single Portfolio
==================================================-->
<!-- Other Works
==================================================-->
<div class="otherWorks text-center">
<div class="container">
<a href="index.html">Retour aux Projets précédents</a><a href="#dernieres-nouvelles">
</div>
</div>
<!-- End: Other Works
==================================================-->
<!-- Start:Footer Section
==================================================-->
<footer class="footer bgc-dark text-white">
<div class="container">
<div class="footer-top text-center-sm">
<div class="row-columns row">
<div class="column col-lg-6 col-sm-6">
<div class="social_footer">
<a class="hvr-push" href="https://www.facebook.com/stephanie.reboul.92"><i class="fa fa-facebook"></i></a>
<a class="hvr-push" href="https://www.instagram.com/stephrbl/"><i class="fa fa-instagram"></i></a>
<a class="hvr-push" href="https://www.linkedin.com/in/st%C3%A9phanie-reboul-463669b2"><i class="fa fa-linkedin"></i></a>
</div>
</div>
</div>
</div>
<div class="copyright text-center">
<span class="text-primary">Stéphanie Reboul</span> © 2016. Tous droits réservés.
</div>
</div>
</footer>
<!-- End:Footer Section
========================================-->
<!-- Scripts
========================================-->
<!-- jquery -->
<script src="js/vendor/jquery-1.12.0.min.js" type="text/javascript" ></script>
<!-- Modernizer -->
<script src="js/modernizr.custom.js" type="text/javascript"></script>
<!-- plugins -->
<script src="js/plugins.js"></script>
<!-- Bootstrap -->
<script src="js/bootstrap.min.js"></script>
<!-- Use For Animation -->
<script src="js/wow.min.js"></script>
<!-- Use For Map -->
<script src="http://maps.google.com/maps/api/js?sensor=false&libraries=geometry&v=3.7"></script>
<!-- Use For Map -->
<script src="js/maplace.js"></script>
<!-- Use For carousel -->
<script src="js/owl.carousel.min.js"></script>
<!-- Use For mixitup gallery -->
<script src="js/jquery.mixitup.min.js"></script>
<!-- Use For Animated Header -->
<script src="js/animatedheader.js"></script>
<!-- Use For Image Peview -->
<script src="js/lightbox.min.js"></script>
<!-- Use For single Page Nav -->
<script src="js/jquery.singlePageNav.min.js"></script>
<!-- Custom Scripts
========================================-->
<script src="js/main.js"></script>
</body>
</html>
Merci d'avance et bon dimanche !
Modifié par stephrbl (02 Oct 2016 - 16:17)