Bootstrap 4 ile Modal Açılır Üye Kayıt ve Üye giriş

Nursen

Paylaşımcı Üye
Katılım
24 Nis 2020
Mesajlar
1,046
Beğeniler
5
uyelik.html olarak kaydedin.

Kod:
1 <!doctype html> 


2 <html lang="en"> 


3 <head> 


4     <!-- Required meta tags --> 


5     <meta charset="utf-8"> 


6     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 


7   


8     <!-- Bootstrap CSS --> 


9     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous"> 


10   


11     <title>Mustafa  VURAL Modal Yapımı</title> 


12 </head> 


13 <body> 


14     <div class="container"> 


15         <div class="row"> 


16             <!-- Button trigger modal --> 


17             <div class="col-md-6"> 


18                 <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#uyegiris"> 


19                     Üye Giriş 


20                 </button> 


21                 <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#kayitol"> 


22                     Kayıt Ol 


23                 </button> 


24             </div> 


25               


26             <!-- Modal --> 


27             <div class="modal fade" id="kayitol" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> 


28                 <div class="modal-dialog" role="document"> 


29                     <div class="modal-content"> 


30                         <div class="modal-header"> 


31                             <h5 class="modal-title" id="exampleModalLabel">Ücretsiz Kayıt OL</h5> 


32                             <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 


33                                 <span aria-hidden="true">×</span> 


34                             </button> 


35                         </div> 


36                         <div class="modal-body"> 


37                             <form action="kaydet.php" method="POST"> 


38                                 <label>Ad Soyad</label> 


39                                 <input class="form-control" type="text" name="kadi"> 


40                                 <label>Mail Adresi</label> 


41                                 <input class="form-control" type="email" name="mail"> 


42                                 <label>Telefon</label> 


43                                 <input class="form-control" type="number" name="tel"> 


44                                 <label>Adres</label> 


45                                 <input class="form-control" type="text" name="adres"> 


46                                 <label>Şifreniz</label> 


47                                 <input class="form-control" type="password" name="pw"> 


48                                 <br> 


49                                 <button type="submit" class="btn btn-success">Kayit OL</button> 


50                                 <button type="button" class="btn btn-danger" data-dismiss="modal">Kapat</button> 


51                             </form> 


52                         </div> 


53                     </div> 


54                 </div> 


55             </div> 


56   


57             <!-- Modal --> 


58             <div class="modal fade" id="uyegiris" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> 


59                 <div class="modal-dialog" role="document"> 


60                     <div class="modal-content"> 


61                         <div class="modal-header"> 


62                             <h5 class="modal-title" id="exampleModalLabel">Üye Giriş</h5> 


63                             <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 


64                                 <span aria-hidden="true">×</span> 


65                             </button> 


66                         </div> 


67                         <div class="modal-body"> 


68                             <form action="giris.php" method="POST"> 


69                                 <label>Kullanıcı Adınız</label> 


70                                 <input class="form-control" type="text" name="kadi"> 


71                                 <label>Şifreniz</label> 


72                                 <input class="form-control" type="password" name="pw"> 


73                                 <br> 


74                                 <button type="submit" class="btn btn-primary">Giriş Yap</button> 


75                                 <button type="button" class="btn btn-danger" data-dismiss="modal">Kapat</button> 


76                             </form> 


77                         </div> 


78                     </div> 


79                 </div> 


80             </div>     


81         </div>   


82   


83         <!-- Optional JavaScript --> 


84         <!-- jQuery first, then Popper.js, then Bootstrap JS --> 


85         <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> 


86         <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> 


87         <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script> 


88     </body> 


89     </html>
 

Şu anda bu konu'yu okuyan kullanıcılar

Benzer konular Forum Tarih
B Ücretsiz Scriptler 0 22
B Ücretsiz Scriptler 0 31
M Link Borsası 0 85
H Site Satış 1 243
F Link Borsası 8 351
JaKaBo Link Borsası 1 234
JaKaBo Link Borsası 2 261
JaKaBo Alışveriş 0 263
D Link Borsası 0 234
G Seo Hizmet Paketleri 7 815
G İnternetten Para Kazanma 1 276
B Ücretsiz Scriptler 0 347
Z Script Satış 0 411
S Script Satış 0 730
W HTML - CSS - XML 0 629

Benzer konular

Üst