I would like to use the bootstrap modal, to open a list of subtitles. But I would like to display the meaning only when clicked on the caption. Do you have any way? No need to have styles just make a slidown.
I used a javascript to load a div:
'<script type="text/javascript" language="javascript">
function abreFecha(sel) {
$(sel).slideToggle();
}
</script>'
<a class="btn btn-primary" data-toggle="modal" data-target="#modal-
mensagem">
<span class="glyphicon glyphicon-th-list"></span> Ver Legendas
</a>
<div class="modal fade" id="modal-mensagem">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
<span>×</span></button>
</div>
<div class="modal-body">
<?php
include 'includes/legenda.php';
?>
<br>
<div id="sigla"> O significado vai aqui</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
</div>
</div>
</div>
legenda.php:
<div class="container-fluid">
<div class="row">
<a href="javascript:abreFecha('#sigla')" class="col-md-1">SS</a>
<a href="javascript:abreFecha('#sigla')" class="col-md-1">ABC</a>
<a href="javascript:abreFecha('#sigla')" class="col-md-1">ECO</a>
</div>
</div>
So now you are opening a modal with some acronyms, clicking opens the div with the meaning. The question now is: How do I display a different text in the same div? Knowing that each acronym has a caption? I would like to have the meaning on the legend page, so it gets cleaner the main page.