Partage

Navbar de Bulma

19 avril 2017 à 11:00:18

Salut à tous,

je suis actuellement en train d'essayer le Framework CSS Bulma que je trouve très sympas. Pour commencer, je souhaite mettre en place la navbar, mais impossible de la faire fonctionner sur mobile. Elle s'adapte bien, ne laissant que le logo et le bouton pour dérouler le menu, mais au clic sur ce dernier rien ne se passe. Normalement un menu devrait apparaître pour afficher les liens de navigation, ce qui n'est malheureusement pas le cas.

Je vous met le code afin que vous puissiez y jeter un coup d'oeil:

<!DOCTYPE html>
<html lang="fr-fr">

    <head>
        <meta charset="utf-8">
		<meta http-equiv="x-ua-compatible" content="ie=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		
		<title>Site with Bulma</title>
		
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.4.0/css/bulma.min.css">
		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
    </head>

    <body>
		<nav class="nav has-shadow">
		  <div class="container">
			<div class="nav-left">
			  <a class="nav-item">
				<img src="http://bulma.io/images/bulma-logo.png" alt="Bulma logo">
			  </a>
			</div>
			<span class="nav-toggle">
			  <span></span>
			  <span></span>
			  <span></span>
			</span>
			<div class="nav-right nav-menu">
			  <a class="nav-item is-tab is-active">Home</a>
			  <a class="nav-item is-tab">Features</a>
			  <a class="nav-item is-tab">Pricing</a>
			  <a class="nav-item is-tab">About</a>
			</div>
		  </div>
		</nav>

		<div style="height:2000px; background-color: rgba(0, 0, 0, 0.075);"></div>
		
		<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
		<!--<script src="http://bulma.io/javascript/jquery-2.2.0.min.js"></script>-->
		<script src="http://bulma.io/javascript/clipboard.min.js"></script>
		<script src="http://bulma.io/javascript/bulma.js"></script>
    </body>

</html>

Ce framework est assez sympa au premier abord alors j'aimerais réellement pouvoir continuer avec lui ^^

En bonus, j'aimerais savoir si vous savez comment faire pour mettre en place un volet pour mobile que l'on peut ouvrir en faisant glisser le doigt, à la manière des applications Android comme le Play Store ou ce que fait le Framework CSS Materialize. Je trouve que ce serait un réel bon point pour la navigation sur mobile. Après il est vrai que ce n'est pas indispensable ;)

Merci à tous pour votre aide.

-
Edité par Radiax18 19 avril 2017 à 11:50:23

</radiax>
19 avril 2017 à 21:57:30

EDIT: /

-
Edité par Romuald44 19 avril 2017 à 22:00:29

19 avril 2017 à 22:05:23

Peut-être je vais dire une bêtise car j'ai essayé pleins de framework CSS mais il me semble que le menu qui s'ouvre n'est pas possible avec Bulma.

Navbar de Bulma

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
  • Editeur
  • Markdown