Bootstrap Snippet toggle Class using HTML CSS Bootstrap jQuery

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/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 text-center">
  <div class="row">
    <div class="div1 col-lg-3">
      <h2>HARUN PEHLİVAN <a href="https://harunpehlivantebimtebitagem.carrd.co" target="_blank"> FOUNDER,CEO BLOGGER</a></h2>
    </div>   
    <div class="div2 col-lg-3">
      <h2>TICENT 2008 <a href="http://tercuman-bilisim-mer.ticiz.com" target="_blank">TEBİM</a></h2>
    </div>
    <div class="div3 col-lg-3">
       <h2>TETRDCENT 2012 <a href="http://harunpehlivantebimtebitagem.business.site/" target="_blank">TEBİTAGEM</a></h2>
    </div>
  </div>
<button class="btn btn-danger"            type="button">click</button>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

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
.container {
  box-sizing:border-box;
  margin-top:40px
}
.div1, .div2, .div3 {
  margin:40px ;
  border:1px solid #000;
  height:200px;
  background:#014976;
  transition:all 2s ease-in-out;
  box-shadow:10px 10px 30px #999  }
h2 {
  font-weight:bold
}
button.btn  {
  margin-top:20px;
  width:200px;
  font-size:25px;
  font-weight:bold;
  padding:15px
}
.blue {
  background:#8aceff;
  color:#7067E8;
  border:1px solid #7067E8;
  transform:rotate(360deg)
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
$(document).ready(function(){
  $("button").click(function(){
    $(".div1").toggleClass("blue");
    $(".div2").toggleClass("blue");
    $(".div3").toggleClass("blue");
  });
});
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

" toggle Class "
Bootstrap 3.0.0 Snippet by harunpehlivan

Related: See More

Questions / Comments:

" toggle Class " Bootstrap 3.0.0 Snippet by harunpehlivan

Related: See More

Questions / Comments:

" toggle Class "
Bootstrap 3.0.0 Snippet by harunpehlivan