javascript - zurb foundation 4 reveal modal changing the text in the data-reveal-id="myModal" -
hi sorry if numpty question.
i'm using reveal , modal working fine.
text "show info" when clicked working. how set text when clicked changes "hide info"
function toggle() { var ele = document.getelementbyid("toggletext"); var text = document.getelementbyid("mymodal"); if(ele.style.display == "block") { ele.style.display = "none"; text.innerhtml = "show"; } else { ele.style.display = "block"; text.innerhtml = "hide"; }} a> id="mymodal" href="javascript:toggle();" data-reveal-id="mymodal"> show /a
how set text when clicked changes "hide info"
what trying not make sense. why, because element causes reveal show "outside" modal. otherwise, if it's inside, won't able open modal through element. based on description have this:
<a href="#" data-reveal-id="mymodal" id="modaltrigger">open modal</a> <div id="mymodal" class="reveal-modal"> <h1>my modal</h1> <a class="close-reveal-modal">×</a> </div>
now want modaltrigger
change text indicate closing modal (i.e. "hide modal") not make sense because modal can closed by:
- clicking anywhere on page modal
- clicking on "x" link on modal
so hide modal
element outside modal useless @ point modal shown.
maybe referring changing text on modal itself, yet again, it's useless because can set it's text "close modal" so:
<a href="#" data-reveal-id="mymodal" id="modaltrigger">open modal</a> <div id="mymodal" class="reveal-modal"> <h1>my modal</h1> <a class="close-reveal-modal">×</a> // inline js make simple example <a class="button" onclick="javascript:$('#mymodal').foundation('reveal', 'close')"> close me</a> </div>
so see don't have change indicate element can close modal.
if question want happen else after modal opened achievable. example if modal's content coming database , take time load, show image loader while fetching done. want loader "to close after modal shown". can this:
$(document).foundation('reveal', { opened: function () { closeimageloader(); }, });
Comments
Post a Comment