2017-01-17 3 views
0

Я пытаюсь реализовать модальность с фундаментом 6.2.4, но это не работает: сФонда 6.2.4 модальных

Модальным является шкурой, но я не могу показать его.

Код:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>RIA2-Projet</title> 
    <link rel="stylesheet" href="css/foundation.css"> 
    <link rel="stylesheet" href="css/app.css"> 
    <link rel="stylesheet" href="assets/foundation-icons/foundation-icons.css" /> 
    <script src="js/vendor/jquery.js"></script> 
    <script src="js/vendor/what-input.js"></script> 
    <script src="js/vendor/foundation.js"></script> 
    <script src="js/app.js"></script> 
</head> 

<body> 

<div class="reveal" id="exampleModal1" data-reveal> 
    <h1>Awesome. I Have It.</h1> 
    <p class="lead">Your couch. It is mine.</p> 
    <p>I'm a cool paragraph that lives inside of an even cooler modal. Wins!</p> 
    <button class="close-button" data-close aria-label="Close modal" type="button"> 
     <span aria-hidden="true">&times;</span> 
    </button> 
</div> 

<p><a data-open="exampleModal1">Click me for a modal</a></p> 

</body> 
</html> 

Edit: Если в моих app.js файл я поставил:

$(document).foundation(); 
$(document).ready(function() { 
    var popup = new Foundation.Reveal($('#exampleModal1')); 
}); 

Это работа, но полагаю, что работать без него правильно?

ответ

0

Некоторые из функций/плагинов Foundation требуют инициализации для работы: https://foundation.zurb.com/sites/docs/javascript.html#initializing

Ваш код хорошо, но $(document).foundation(); требуется для запуска любой из плагинов Foundation, которые используют JavaScript/JQuery.

Вы также можете инициализируетесь только модальности с:

$('reveal').foundation();

Вот скрипка с ним работать (с использованием минимального файла включает в себя): https://jsfiddle.net/gbyobLt5/

Смежные вопросы