"Tabs in reading block - Moodle 3.3.3"
Bootstrap 2.3.2 Snippet by dgcruzing

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<h4>Working well in Moodle 3.3.3 - Note using the FontAwesome Icon Filter- plugin for icons</h4>
</div>
</div>
</div>
</div>
<!-- Start of content block - copy from below this for Moodle -->
<div class="editor-indent" style="margin-left: 20px; padding: 0 0 0 40px; margin-right: 50px">
<h5>Intro text</h5>
<div class="panel panel-default" style="box-sizing: border-box; margin-bottom: 24px; border: 1px solid rgb(221, 221, 221); border-radius: 4px; box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 1px; color: rgb(51, 51, 51); ;">
<div class="panel-heading"><h3>[fa-book]Reading:</h3></div>
<div class="panel-body"><div class="panel-body"><h5>Some text</h5>
<!-- Start of content block -->
<!-- Start of content block -->
<div class="editor-indent" style="margin-left: 20px; padding: 0 0 0 40px; margin-right: 50px">
<ul class="nav nav-tabs">
<li class=""><a data-toggle="tab" href="#home">FAQ 1</a></li>
<li class="active"><a data-toggle="tab" href="#menu1">FAQ 2</a></li>
<li class=""><a data-toggle="tab" href="#menu2">FAQ 3</a></li>
</ul>
<div class="tab-content">
<div id="home" class="tab-pane fade"><p>tab1</p></div>
<div id="menu1" class="tab-pane fade active in"><p>tab2</p></div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: