SHARE
TWEET

Jadwal Sholat Juni

a guest Jun 25th, 2019 41 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7.     <title>Document</title>
  8.     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  9.     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
  10.  
  11.    
  12.     <script type="text/javascript">
  13.     $(function(){
  14.         var apiSolat = "http://api.aladhan.com/v1/calendarByAddress?address=Yogyakarta&method=2&month=06&year=2019";
  15.         $.getJSON(apiSolat, function(data,status){
  16.             $('.1imsyak').html(data.data[0].timings.Imsak);
  17.             $('.1subuh').html(data.data[0].timings.Fajr);
  18.             $('.1dzuhur').html(data.data[0].timings.Dhuhr);
  19.             $('.1ashar').html(data.data[0].timings.Asr);
  20.             $('.1magrib').html(data.data[0].timings.Maghrib);
  21.             $('.1isya').html(data.data[0].timings.Isha);
  22.             // itu yang diatas baru tanggal 1
  23.             // tanggal 2 dan seterusnya kamu buat sama kayak diatas
  24.             // tapi diganti aja indexnya, kalo tanggal satu dimulai dari 0 tanggal 2 dari index 1
  25.             $('.2imsyak').html(data.data[1].timings.Imsak);
  26.             $('.2subuh').html(data.data[1].timings.Fajr);
  27.             $('.2dzuhur').html(data.data[1].timings.Dhuhr);
  28.             $('.2ashar').html(data.data[1].timings.Asr);
  29.             $('.2magrib').html(data.data[1].timings.Maghrib);
  30.             $('.2isya').html(data.data[1].timings.Isha);
  31.         });
  32.     });
  33.     </script>
  34.  
  35. </head>
  36. <body>
  37.     <div class="container">
  38.         <div class="row">
  39.             <h2>Jadwal Sholat Yogya Bulan Juni</h2>
  40.             <table class="table table-striped">
  41.                 <thead>
  42.                     <tr>
  43.                         <th>Tanggal</th>
  44.                         <th>Imsyak</th>
  45.                         <th>Subuh</th>
  46.                         <th>Dzuhur</th>
  47.                         <th>Ashar</th>
  48.                         <th>Magrib</th>
  49.                         <th>Isya</th>
  50.                     </tr>
  51.                 </thead>
  52.                 <tbody>
  53.                     <tr>
  54.                         <td>1</td>
  55.                         <td class="1imsyak"></td>
  56.                         <td class="1subuh"></td>
  57.                         <td class="1dzuhur"></td>
  58.                         <td class="1ashar"></td>
  59.                         <td class="1magrib"></td>
  60.                         <td class="1isya"></td>
  61.                     </tr>
  62.                     <tr>
  63.                         <td>2</td>
  64.                         <td class="2imsyak"></td>
  65.                         <td class="2subuh"></td>
  66.                         <td class="2dzuhur"></td>
  67.                         <td class="2ashar"></td>
  68.                         <td class="2magrib"></td>
  69.                         <td class="2isya"></td>
  70.                     </tr>
  71.                 </tbody>
  72.             </table>
  73.         </div>
  74.     </div>
  75. </body>
  76. </html>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top