<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/gh/djibe/bootstrap-switch/dist/js/bootstrap-switch.min.js"></script> <link href="https://cdn.jsdelivr.net/gh/djibe/bootstrap-switch@6a41c824782c514fd5e09b6683f852a9c9b2a997/dist/css/bootstrap4/bootstrap-switch.min.css" rel="stylesheet" /> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Strait"> <div class="container" style="font-family: 'Strait', sans-serif;"> <div class="row" style="margin-top:20px"> <div class="col-md-6 col-sm-6 col-xs-12"> <div class="panel panel-default"> <div class="panel-heading clearfix"> <h3 class="h3">Resmi gün Input Title</h3> <h4 class="h4">Input Text</h4> <h5 class="h5">5 Mayıs 2026 perşembe saat : 10:00:00 </h5> </div> <div class="col-md-12" style="margin-top:15px"> <div class="thumbnail"> <a href="/w3images/lights.jpg" target="_blank"> <img src="https://cdn1.ntv.com.tr/gorsel/ZLEPpp4pa06sFdNX2uJ63A.jpg?width=1200&ampmode=crop&ampscale=both" alt="Lights" style="width:100%"> <div class="caption"> <p>19 Mayıs Resmi.</p> </div> </a> </div> </div> <div class="panel-body"> <div class="input-group input-group-lg"> <span class="input-group-addon">Title</span> <input type="text" class="form-control input-lg" placeholder="Username"> </div> <br> <div class="input-group input-group-lg"> <span class="input-group-addon">Text</span> <input type="text" class="form-control input-lg" placeholder="Username"> </div> <br> <div class="input-group input-group-lg"> <span class="input-group-addon">Resim URL</span> <input type="text" class="form-control input-lg" placeholder="Username"> </div> <br> <div class="input-group input-group-lg"> <span class="input-group-addon">Tarih</span> <input type="text" class="form-control input-lg" placeholder="Username"> </div> <br> <input id="resmibayram" type="checkbox" name="my-checkbox" data-on-color="success" data-off-color="danger" data-on-text="<i class='fa fa-eye'></i>" data-off-text="<i class='fa fa-eye-slash'></i>" /> <br><br> <div class="row"> <div class="col-xs-2" style="padding:0 !important" > <button type="button" style="margin:0 15px" class="btn btn-info btn-block btn-lg">Kaydet</button> </div> <div class="col-xs-10"> <div class="well" style="margin-left:15px" id="bayram_sonuc" >.</div> </div> </div> </div> </div> </div><!-- col-md-6 --> <div class="col-md-6 col-sm-6 col-xs-12"> <div class="panel panel-default"> <div class="panel-heading clearfix"> <h3 class="h3">Gerisayım Input Title</h3> <h4 class="h4">Input Text</h4> <h5 class="h5">5 Mayıs 2026 perşembe saat : 10:00:00 </h5> </div> <div class="panel-body"> <div class="input-group input-group-lg"> <span class="input-group-addon">Title</span> <input type="text" class="form-control input-lg" placeholder="Username"> </div> <br> <div class="input-group input-group-lg"> <span class="input-group-addon">Title</span> <input type="text" class="form-control input-lg" placeholder="Username"> </div> <br> <div class="input-group input-group-lg"> <span class="input-group-addon">Title</span> <input type="text" class="form-control input-lg" placeholder="Username"> </div> <br> <input id="gerisayim" type="checkbox" name="my-checkbox" data-on-color="success" data-off-color="danger" data-on-text="<i class='fa fa-eye'></i>" data-off-text="<i class='fa fa-eye-slash'></i>" /> <br><br> <div class="row"> <div class="col-xs-2" style="padding:0 !important" > <button type="button" style="margin:0 15px" class="btn btn-danger btn-block btn-lg">Kaydet</button> </div> <div class="col-xs-10"> <div class="well" style="margin-left:15px" id="gerisayim_sonuc" >.</div> </div> </div> </div> </div><!-- col-md-6 --> </div> </div><!-- row --> </div> </div>

$(document).ready(function () { $("#resmibayram, #gerisayim").bootstrapSwitch({ html: true }); $("#resmibayram").on('switchChange.bootstrapSwitch', function(event, state) { var sonuca = event.target.checked; $("#bayram_sonuc").text(sonuca); $(this).attr('data-switch-value', event.target.checked); }); bayram_sonuc $("#gerisayim").on('switchChange.bootstrapSwitch', function(event, state) { var sonucb = event.target.checked; $("#gerisayim_sonuc").text(sonucb); $(this).attr('data-switch-value', event.target.checked); }); });