alexandram49722039 wrote @osgood_ i'll try and upload it somewhere, do you have any easy way to do that ? |
Well just paste the pages code in the forum along with the css.
Below is you original page code you posted with the script inserted. What doesnt work? There's no css apart from the 'displayed' and 'collapsed' styles which control the navigation.
Ive taken out the orginal link to the menu.js script (see below) as this could be why the new script is not working. You may have something in that which conflicts.
<script type="text/javascript" src="js/menu.js"></script>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Astuces pour dys: les différents dys</title>
<link href="styles/responsive.css" rel="stylesheet" type="text/css">
<!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.-->
<script>var __adobewebfontsappname__="dreamweaver"</script>
<script src="http://use.edgefonts.net/andika:n4:default.js" type="text/javascript"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.displayed {
display: block;
}
.collapsed {
display: none;
}
</style>
</head>
<body>
<div id="wrapper">
<header>
<h1> Astuces pour Dys </h1>
<nav>
<h2 id="menulink"><a href="#navlinks">Menu</a></h2>
<ul class="displayed" id="navlinks" >
<li><a href="index.html" class="thispage">Page d'acceuil</a></li>
<li><a href="differentsdys1.html" >Les différents Dys</a></li>
<li><a href="#">Livres Dys, maisons d'éditions dys</a></li>
<li><a href="#">Matériel adapté</a></li>
<li><a href="#">Chaine youtube et liens</a></li>
</ul>
</nav>
</header>
<div id="hero">
<img src="part4/gif/octopus-idle.gif" width="450" height="300" alt=""/>
<p>Astuces pour Dys vous tient informés des dernières astuces pour les Dys.</p>
</div>
<main>
<h2>La petite histoire</h2>
<p>Ce site a été créé pour la page Facebook <span style="font-size: 1em; font-style: bold; font-weight: 400;">Astuces pour Dys </span>et pour sa créatrice Françoise Chée. Vous pourrez retrouver toutes les informations nécessaires à la compréhention de votre enfant atteint de troubles Dys, ou juste assouvir votre curiosité et en apprendre plus sur les handicaps invisibles souvent méconnus ou dénigrés. </p>
<figure><img src="part4/images/logo dys.jpg" width="200" height="200" alt=""/>
<figcaption>Logo handicap DYS créé par Françoise Chée</figcaption>
</figure>
<p >Cette passion est née d'une maman d'enfant dys, qui a voulu créé une <a href="http://www.facebook.com/astucespourdys">page Facebook</a> pour partager son expérience et ses astuces avec une autre maman à la base. Puis j'ai ouvert cette page à d'autres personnes et me suis associée au groupe Dyscussions Parents Professeurs. Une merveilleuse rencontre virtuelle ... qui réunit aujourd'hui plus de 64 000 personnes, et qui continue de grandir: c'est pourquoi Facebook ne suffisait plus pour porter assistance à une telle communauté. </p>
</main>
<aside>
<h2>Le site: comment?</h2>
<p>C'est pourquoi nous sommes ici! Ce site est fait de manière bénévole par <strong>Alexandra MANSUY</strong>, élève d'ESIEE Paris, qui est toujours en apprentissage, donc le site s'améliorera ultérieurement. Pour plus de contenu,voici <a href="http://www.astucespourdys.com"> le WORDPRESS d'Astuces pour dys</a>.
</p>
<p style="font-size: 1em; color: #CD0003;">Pour commencer la navigation sur le site, cliquez sur les menus en haut de la page, et plongez dans l'univers des Dys! </p>
</aside>
<footer>
<p>Si vous avez des questions concernant les Dys, contactez la page facebook Astuces pour Dys, et pour les questions concernant le site, ou si vous voulez prendre contact avec la créatrice, envoyez un mail à l'adresse : alexandram9a@gmail.com</p>
</footer>
<script>
var menulink = document.querySelector('#menulink'),
navlinks = document.querySelector('#navlinks');
menulink.addEventListener('click', controlMenu);
function controlMenu() {
if(navlinks.className === 'displayed') {
navlinks.className = 'collapsed';
}
else {
navlinks.className = 'displayed';
}
}
window.addEventListener('resize', resize);
function resize() {
if (window.innerWidth < 768) {
navlinks.className = 'collapsed';
}
if (window.innerWidth > 768) {
navlinks.className = 'displayed';
}
}
</script>
</div>
</body>
</html>