Friday, August 7, 2015

Cara Membuat Pop Up Modal Dengan Bootstrap

Cara Membuat Pop Up Modal Dengan Bootstrap - Membuat Pop Up Modal Dengan bootstrap memang sangat menyenangkan apalagi jika teman-teman tambahkan sentuhan ajax di dalam nya tentu akan sangat interaktif sekali buat user,modal di bootstrap tidak ada kaitan nya dengan uang atau money ('inggris') tapi jika kita artikan modal adalah suatu kotak dialog interaktif yang berguna sebagai media untuk user menginput data,sebagai notifikasi dan masih banyak lagi,,
Cara Membuat Pop Up Modal Dengan Bootstrap
Add caption

untuk membuat modal pop up di bootstrap silahkan teman-teman download terlebih dahulu
master file bootstrap dan jquery nya disini dan disini oh iya hampir lupa biar teman-teman terbayang seperti apa sih modal pop up bootstrap itu nah di bawah ini sudah saya sertakan gambar dan demo nya,,silahkan teman-teaman lihat.. atau sudah saya sertakan DEMO nya
DEMO

Cara Menggunakan

silahkan teman-teman buat basic template bootstrap nya terlebih dahulu,dengan cara copas kode di bawah ini,itu merupakan basic template bootstrap
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>slider by Chandra Hamdani</title>

    <!-- link bootstrap teman-teman -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

  </head>
  <body>
    <!-- mulai -->
   <!-- selesai -->
<!-- link jquery teman-teman -->
    <script src="jquery/1.11.3/jquery.min.js"></script>
    <!-- link bootstrap.js teman-teman-->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>

nah setelah itu teman-teman copas code di bawah ini sebagai markup dari si modal tersebut




yang perlu di perhatikan dalam pembuatan slider dengan bootstrap dalah letak link js dan css teman-teman,contoh nya jika teman-teman meletekan file bootstrap.js di atas link jquery naka si slider nya tidak akan bekerja...So Mudah kan,sampai bertemu di artikel selanjutnya

- chandra hamdani -

Artikel Terkait

1 komentar so far