0
div-panelをフルスクリーンにし、その幅と高さをウィンドウの幅と高さに等しくするには、fa-arrows-altアイコンをクリックし、fa-minusアイコンをクリックすると、div.panel-dashboardがアニメーション化されて最初のサイズに戻ります。ボタンをクリックしてdivをサイズ変更してフルスクリーンになる方法
<div class="row">
<div class="col-sm-6">
<section class="panel-dashboard hide1">
<div class="header color-purple-header">
<div class="controls">
<i class="fa fa-close"></i>
<i class="fa fa-minus ml5"></i>
<i class="fa fa-arrows-alt ml5"></i>
</div>
</div>
<div class="body body2 color-purple-body">
text1
</div>
</section>
</div>
<div class="col-sm-6">
<section class="panel-dashboard hide1">
<div class="header color-purple-header">
<div class="controls">
<i class="fa fa-close"></i>
<i class="fa fa-minus ml5"></i>
<i class="fa fa-arrows-alt ml5"></i>
</div>
</div>
<div class="body body2 color-purple-body">
text2
</div>
</section>
</div>
</div>
$(document).ready(function() {
$('.fa-arrow-circle-left').click(function() {
var $win = $(window);
$('.panel-dashboard').animate({ height: $win.height() }, 500);
$('.panel-dashboard').animate({ width: $win.width() }, 500);
});
$('.fa-minus').click(function() {
var $win = $(window);
$('.panel-dashboard').animate({ height: 250px }, 500);
$('.panel-dashboard').animate({ width: '100%' }, 500);
});
});
を引用しなければならない ''