muqriz
/
SIBS2024
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
6 Commits
1 Branch
Tree: 5fc91c5e06
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from '5fc91c5e06'
${ noResults }
SIBS2024/lists/bentong.html

bentong.html 16KB
History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233 
  1. <!DOCTYPE html>

  2. <html>

  3. 

  4. <head>

  5.     <meta charset="UTF-8">

  6.     <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->

  7.     <!-- CSP is a PITA ;). Disabled, don't try this at home!-->

  8.     <meta http-equiv="Content-Security-Policy" content="">

  9.     <!-- include bulma css -->

  10.     <link rel="stylesheet" href="bulma/css/bulma.min.css">

  11.     <title>My Test App</title>

  12.     <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.min.css">

  13.     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-abc123..." crossorigin="anonymous" />

  14.     <link rel="stylesheet" href="../css/app.css">

  15. </head>

  16. 

  17. <body>

  18.     <section class="section" style="max-height: 100vh;">

  19. 

  20.         <div class=""

  21.             style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">

  22.             <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="index.html"><i

  23.                         class="fas fa-chevron-left"></i></a></h6>

  24.             <h6 style="color: white;">Jerantut</h6>

  25.         </div>

  26. 

  27.         <div class="text-center pt-5"

  28.             style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">

  29.             <button id="pembangun_btn" type="button" class="p-1"

  30.                 style="font-weight: 500; border-top: 4px solid #BF3030; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pembangunan&emsp;&emsp;</button>

  31.             <button id="penternakan_btn" type="button" class="p-1"

  32.                 style="font-weight: 500; border-top: 4px solid #3B47E0; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Penternakan&emsp;&emsp;</button>

  33.             <button id="pertanian_btn" type="button" class="p-1"

  34.                 style="font-weight: 500; border-top: 4px solid #E2E236; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pertanian&emsp;&emsp;</button>

  35.             <button id="industri_btn" type="button" class="p-1"

  36.                 style="font-weight: 500; border-top: 4px solid #32A740; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Industri&emsp;&emsp;</button>

  37.         </div>

  38. 

  39.         <div class="text-center pt-1"

  40.             style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">

  41.             <div class="pt-5" style="width: 600px;height: 100px;">

  42.                 <svg class="map-svg" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"

  43.                     xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-30 -30 1150 1150"

  44.                     style="enable-background: new 0 0 1080 1080" xml:space="preserve">

  45.                     <g>

  46.                         <a href="testing.html" data-area="jerantut">

  47.                             <path id="jerantut" class="pahang-barat" d="M431.5,110.2c5.4,5.9,6.4,12.3,2.5,19.5c-3.7,6.8-4.5,14.3-3.7,21.9h0c6.1,6.2,11.1,12-3.4,12.9

  48.                                         c-4.7,0.3-7.1,4.1-9.8,7.3c-3.3,9.5-3.4,18.6,2.6,27.4c4.8,7.1,2.7,15.3,3.2,23.1c6.7,4.2,9.9,10.2,9.4,18.1c0,0.4-0.1,0.9,0,1.3

  49.                                         c10.5,20.1,4.7,41.2,3.7,62c3.3,0.8,6.6,1.5,9.9,2.3c7.1,1.7,16,3.6,16.1,11.6c0.1,7.7-5.5,14.9-13.2,18.9c-4.1,2.1-8.1,4.6-12.5,6

  50.                                         c-7.9,2.5-18.2,1.9-15.2,15.6c0.5,2.3-6.1,5.6-8,2.5c-6.5-10.5-22-8.4-27-20.7c-2.8-6.9-11.3-6.5-16.5-10.9c-3.7-3.2-7.2-0.5-7,4.7

  51.                                         c0.1,2.9,0.7,5.8,1,8.7c1.1,4.1,2.7,7.5,6.1,10.6c8.4,7.6,7.2,14.4-2.8,19.2c-1.9,0.9-3.9,1.4-5.9,2.1c-21.4,6.9-22.1,9.7-4.7,25.1

  52.                                         c6,5.3,8.7,9.3,0.1,14c-0.5,3.7-0.3,7.7-1.6,11.1c-3.6,9.5,3.7,13.5,8.9,11.1c15.5-7.3,33.5-5.8,48.3-14.7c0,0,0,0,0,0

  53.                                         c0.8-5.5,3.8-8.5,9.4-7.2c5.9,1.4,7.7,5.6,6.9,11.5c-0.6,4.5-0.6,9.1-0.9,13.7c0,0,0,0,0,0c4.4,1,8.2-1.1,12.2-2.3

  54.                                         c3.7-1.1,9.5-2.2,10.5,1.2c4.4,13.6,15.3,8.5,23.6,8.4c9.1-0.2,14.2,3.1,16.9,11.3c0.5,1.6,1.3,3.1,2.2,4.5

  55.                                         c3.7,5.7,4.8,16.6,12.2,15.5c7-1,11.5-10.1,16-16.9c7.6-11.4,9.9-23.7,8.1-37c-0.7-5.4,0.2-10.7,7.1-11c6.5-0.3,11.1,2.7,12.9,9.6

  56.                                         c1,3.9-2,10,5,11.3c0,0,0,0,0,0c7.8-9.7,17.1-3.1,25.9-2.3c0,0,0,0,0,0c9.3-10.9,18.8-4,28.3-1.1c0.9,0,2,0.4,3.1,0.8

  57.                                         c10.6-0.9,20.1,8.8,31.2,3.3c15.2-9,12.5-28.7,24.3-40.1c5.4-5.2,11.4-9.6,16.9-14.7c5.9-5.6,10.6,1.1,13.3,6.4

  58.                                         c4.9,9.6,10.1,7.4,12.2-0.6c4.4-16.9,14.8-26.4,31.2-30.2c1.5-3.4,3.2-6.9,1.2-10.6c-6-11.1-1.7-19.8,6.2-27.7c0,0,0,0,0,0

  59.                                         c-3.8-3.3-7.7-6.5-11.2-10.1c-3.6-3.6-5.9-9.1-1.6-12.4c10.9-8.4,9.7-18.2,6-29.2c-1.3-3.9,1.5-7.3,3.7-10.4

  60.                                         c2.5-3.5,4.2-7.3,3.4-11.8c-1.1-6.5,1.8-11.4,6.7-15.5c2.9-2.4,6.2-4.9,6.9-8.9c2.2-12.1,8.6-17.9,24.1-13.2

  61.                                         c-4.2-8.1-7.4-14.8-3.2-20.1c12.5-15.7,0.6-26.4-7.1-37.8c-5.6-8.2-13-10.7-23.1-5.7c-9.3,4.6-20.1,5.9-28.9-0.9

  62.                                         c-10.7-8.2-17.2-19.4-18.1-33.4c-0.4-6.2-1.4-12,7.1-13.5c4.7-0.8,6.7-3.9,4-8.3c-2.6-4.2-1.9-7.1,2.2-9.4c1.8-1,3.6-1.8,3.3-4.6

  63.                                         c-1.7-15.9-19.5-28.8-35.8-25.6c-3.4,0.7-6.5,1.3-10,0.6c-21.3-4.2-39.7-13-51.6-32.3c-2.2-3.6-5.3-7-9.6-7.8

  64.                                         c-5.9-1.2-10.9-10.1-16.8-4.9c-5.9,5.2-2.8,13.2-0.6,20.2c1.5,4.6,4.9,10,0.1,14.1c-4.1,3.5-10.8,3.2-14.5,0.9

  65.                                         c-10.1-6.3-14.5-0.7-20.1,6.4c-8.4,10.4-13.2,10.3-23,1.2c-2.5-2.3-4.6-5-6.9-7.4c-7.6-7.9-33.2-11.8-42.8-6.8

  66.                                         c-3.7,1.9-2.3,4.5-2.2,7.4c0.2,12.7-10,19.1-17.9,26c-6.4,5.5-13.4-0.5-19.5-4.2c-13.3-8-23.5-3.9-28.1,11c0,0,0,0,0,0

  67.                                         C414.2,86.1,420.9,98.6,431.5,110.2z" />

  68.                         </a>

  69.                     </g>

  70.                 </svg>

  71. 

  72. 

  73.             </div>

  74.         </div>

  75. 

  76. 

  77.         <div id="pembangun_plot" class="content-div">

  78.             <div class="text-center pt-5"

  79.                 style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">

  80.                 <h6>Pembangunan</h6><br>

  81. 

  82.             </div>

  83.             <div class="text-center pt-2 text-nowrap flex-wrap"

  84.                 style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">

  85.                 <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"

  86.                     role="button">HSD 23453</a>

  87.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  88.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  89.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  90.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  91.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  92.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  93.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  94.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  95.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  96.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  97.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  98.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  99.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  100.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  101.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  102.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  103.                 <a href="detail.html" class="button-23 mb-2"

  104.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  105.             </div>

  106.         </div>

  107. 

  108.         <div id="penternakan_plot" class="hidden content-div">

  109.             <div class="text-center pt-5"

  110.                 style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">

  111.                 <h6>Penternakan</h6><br>

  112. 

  113.             </div>

  114.             <div class="text-center pt-2 text-nowrap flex-wrap"

  115.                 style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">

  116.                 <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"

  117.                     role="button">HSD 23453</a>

  118.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  119.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  120.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  121.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  122.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  123.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  124.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  125.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  126.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  127.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  128.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  129.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  130.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  131.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  132.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  133.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  134.                 <a href="detail.html" class="button-23 mb-2"

  135.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  136.             </div>

  137.         </div>

  138. 

  139.         <div id="industri_plot" class="hidden content-div">

  140.             <div class="text-center pt-5"

  141.                 style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">

  142.                 <h6>Industri</h6><br>

  143. 

  144.             </div>

  145.             <div class="text-center pt-2 flex-wrap"

  146.                 style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">

  147.                 <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"

  148.                     role="button">HSD 23453</a>

  149.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  150.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23sss453</a>

  151.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  152.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  153.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  154.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  155.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  156.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  157.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  158.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  159.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  160.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  161.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  162.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  163.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  164.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  165.                 <a href="detail.html" class="button-23 mb-2"

  166.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  167.             </div>

  168.         </div>

  169. 

  170.         <div id="pertanian_plot" class="hidden content-div">

  171.             <div class="text-center pt-5"

  172.                 style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">

  173.                 <h6>Pertanian</h6><br>

  174. 

  175.             </div>

  176.             <div class="text-center pt-2 text-nowrap flex-wrap"

  177.                 style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">

  178.                 <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2"

  179.                     role="button">HSD 23453</a>

  180.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  181.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  182.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  183.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  184.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  185.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  186.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  187.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  188.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  189.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  190.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  191.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  192.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  193.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  194.                 <a href="detail.html" class="button-23 mb-2 mr-2"

  195.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  196.                 <a href="detail.html" class="button-23 mb-2"

  197.                     style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>

  198.             </div>

  199.         </div>

  200. 

  201.     </section>

  202. 

  203.     <script>

  204. 

  205.         document.getElementById('pembangun_btn').addEventListener('click', function () {

  206.             showDiv('pembangun_plot');

  207.         });

  208. 

  209.         document.getElementById('penternakan_btn').addEventListener('click', function () {

  210.             showDiv('penternakan_plot');

  211.         });

  212. 

  213.         document.getElementById('pertanian_btn').addEventListener('click', function () {

  214.             showDiv('pertanian_plot');

  215.         });

  216. 

  217.         document.getElementById('industri_btn').addEventListener('click', function () {

  218.             showDiv('industri_plot');

  219.         });

  220. 

  221.         function showDiv(divId) {

  222.             var divs = document.getElementsByClassName('content-div');

  223.             for (var i = 0; i < divs.length; i++) {

  224.                 divs[i].classList.add('hidden');

  225.             }

  226.             document.getElementById(divId).classList.remove('hidden');

  227.         }

  228.     </script>

  229.     <script defer src="/ruta relativa a mi archivo .js"></script>

  230. 

  231. </body>

  232. 

  233. </html>