/ / Разкриване на модал в Фондация 4 - zurb-foundation

Разкриване на модал в Фондация 4 - фондация zurb

Как разкривате модално програмно в Фондация 4?

В Фондация 3 имахме лесен за използване метод reveal ().

Какво можете да използвате във Фондация 4? Моля помогнете.

Отговори:

4 за отговор № 1

Аз съм сигурен, че можете просто да използвате .foundation метод на вашия модал да се обадя "отворен" върху него .. Нещо като:

$("#myModal").foundation("reveal", "open");

e: Просто провери документите и да, ето там: http://foundation.zurb.com/docs/components/reveal.html

Потърсете "Можете също така да отворите и затворите Открийте чрез JavaScript:"


2 за отговор № 2

За съжаление, във Фондация 4 трябва да имате товаза да отворите модал = / За съжаление не защото ще трябва да напишем много повече код (това не е вярно), а защото това изпълнение не е, да речем, хубаво.

Моят код за модал:

<!-- MODAL BOX START CONFIGURATION -->
<a class="reveal-link" data-reveal-id="modal"></a>
<div id="modal" class="reveal-modal medium">
<div id="modalContent"></div>
<a class="close-reveal-modal">&#215;</a>
</div>

Функцията JS се отваря и поставя някакво съдържание в модала

function openModal(url,params,text){

// If @url is not empty then we change the #modalContent value with the @url value
if(url !== "")
{
ajaxLoad("#modalContent",url,params);
}
// If @text is not empty then we change the #modalContent value with the @text value
else if(text !== "")
{
$("#modalContent").html(text);
}

// If both @url and @text are empty, then the #modalContent remains unchanged.
// Now we just show de modal with the changed (or not) content
$("a.reveal-link").trigger("click"); }

Надявам се, че помага!


0 за отговор № 3

За програмен (javascript) достъп до документи изглежда само предлагат стартиране чрез кликване събитие.

Добавете модула си:

<div id="myModal" class="reveal-modal">
<h2>Awesome. I have it.</h2>
<p class="lead">Your couch.  It is mine.</p>
<p>Im a cool paragraph that lives inside of an even cooler modal. Wins</p>
<a class="close-reveal-modal">&#215;</a>
</div>

Задаване на спусъка:

<a href="#" data-reveal-id="myModal" id="my-trigger">Click Me For A Modal</a>

Активиране на програмното задействане:

$("#my-trigger").trigger("click");

Разбира се, това изглежда като работа наоколо, може би това се дължи на повишеното им "леко / мобилно" първо внимание. Да видим какво ще донесе следващата версия.


0 за отговор № 4
$("#myModal").foundation("reveal", "open");