HTML/CSS de la Barre de Navigation sur plusieurs pages
Je viens de finir de faire mes home/index.html page. Pour garder la barre de navigation où il est, et de rester, tandis que les utilisateurs cliquent à travers toutes mes pages. Dois-je copier et coller la valeur liquidative code en haut de chaque page? Ou est-il une autre façon de faire qui serait plus propre?
HMTL nav:
<nav>
<div>
<a href="/">
<div id="logo"><img src="image.png" alt="Home"/></div>
<div id="headtag"><img src="image.png" alt="Home"/></div>
<div id="tagline"><img src="image.png" alt="Home"/></div>
</a>
</div>
<div>
<a href="/" class="here">Home</a>
<a href="/about.html" >About</a>
<a href="/services.html" >Services</a>
<a href="/pricing.html" >Pricing</a>
<a href="/contact.html" >Contact Us</a>
<input id="srchbar" type="search" placeholder="Search">
</div>
</nav>
- Oui. Gardez à l'esprit que lorsqu'un utilisateur clique sur un lien dans votre navigation, votre serveur/système local est d'envoyer le fichier indiqué par le lien de téléchargement et d'affichage. Lorsqu'ils cliquent sur "Sur les,"
about.html
sera chargé par le navigateur. Donc, il doit contenir la même navigation. - si vous avez un langage côté serveur, vous pouvez mettre ce code dans un template et d'inclure dans toutes les pages d'utiliser angular js pour faire de cette directive
- Je suis à la recherche de la même chose. C'est une honte que, en 2017, nous ne pouvons pas faire cela avec un client basé sur le web site. Microsoft a eu le concept d'une page maître (_layouts dans la version actuelle) pour toujours. Semble comme un "conteneur de la page" ne serait pas ridicule.
InformationsquelleAutor blackRob4953 | 2015-08-12
Vous devez vous connecter pour publier un commentaire.
C'est ce qui m'a aidé. Ma barre de navigation est dans la balise body. Code complet de la barre de navigation est en
nav.html
fichier (sans le html ou le corps de la balise, seul le code barre de navigation). Dans la page cible, ceci va dans lehead
tag:Puis dans la balise body, un conteneur est fait avec un identifiant unique et un block javascript pour charger le
nav.html
dans le conteneur, comme suit:<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
, puis ce qui se passe à votre page lorsque la Version 1.10.3 ou 1.11.0 sortir?Je sais que c'est une très vieille question, mais quand vous avez JavaScript disponibles vous pouvez utiliser jQuery et AJAX méthodes.
Tout d'abord, créez une page avec tous la barre de navigation du contenu HTML.
Prochaine, l'utilisation de jQuery
$.get
méthode pour récupérer le contenu de la page. Par exemple, disons que vous avez mis tous les la barre de navigation du HTML dans un fichier appelénavigation.html
et ajouté un espace réservé à l'étiquette (Comme<div id="nav-placeholder">
) dans votreindex.html
, alors vous devez utiliser le code suivant:jquery.min.js
sur ce que l'autre réponse, dit?jquery-1.10.2.js
fait.Vous pouvez utiliser php pour faire du multi-site web page.
<?
php include 'header.php';
?>
(Code ci-dessus vidage du code html avant le présent)de Votre site le contenu du corps.
<?php include 'header.php'; ?>
Aller à php.net ou w3schools pour l'apprentissage de base.Je ne sais pas si ça marchera pour vous, mais il fonctionne pour moi. Essayez de placer la navigation codes sans en-tête ou le corps de la balise(juste le code dans lequel la barre de navigation a commencé et s'est terminée). Ce qui va se produire est que vous allez placer séparément les codes de la barre de navigation. Disons que vous avez déjà les codes de navigation sur navigation.html et vous pourrez l'inclure à l'autre page, disons que ce serait index.php. Pour l'inclure à l'intérieur du corps de la balise et de la barre de navigation serait chargé sur elle.
Un très vieux mais assez simple consiste à utiliser "Server-Side Includes", afin d'inclure des pages HTML sur une page de premier niveau qui a le
.shtml
extension. Par exemple, ce serait votreindex.shtml
fichier:Oui, il est boiteux, mais il fonctionne. N'oubliez pas d'activer le SSI de l'aide dans votre configuration du serveur HTTP (c'est la façon de faire pour Apache).
Brando ZWZ fournit quelques grandes réponses pour traiter cette situation.
Re: Même barre de navigation sur plusieurs pages
21 août 2018 10:13 AM|LIEN
Autant que je sache, il y a plusieurs solution.
Par exemple:
Le code Entier de la barre de navigation est en nav.html fichier (sans le html ou le corps de la balise, seul le code barre de navigation).
Puis nous avons pu charger directement à partir du jquery sans écrire beaucoup de code.
Comme ceci:
Solution2:
Vous pouvez utiliser du code JavaScript pour générer l'ensemble de la barre de navigation.
Comme ceci:
Code Javascript:
Html:
https://forums.asp.net/t/2145711.aspx?Same+barre de navigation+sur+plusieurs+pages