linkinPARK
Path:
C:
/
AppServ
/
www
/
fsct
/
[
Home
]
File: team.html
<!DOCTYPE html> <html> <head> <title>Bootstrap 3</title> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link href="Content/bootstrap.css" rel="stylesheet" /> <link href="Content/font-awesome.min.css" rel="stylesheet" /> <link href="Content/Style.css" rel="stylesheet" /> </head> <body> <nav class="navbar navbar-default navbar-fixed-top"> <div class="container-fluid"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-menu"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="index.html">Boostrap 3</a> </div> <div class="collapse navbar-collapse" id="navbar-menu"> <ul class="nav navbar-nav"> <li><a href="index.html"><i class="fa fa-home"></i> Home</a></li> <li><a href="about.html"><i class="fa fa-warning"></i> About</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-flag-o"></i> Innovate <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="innovate.html">Learn</a></li> <li><a href="innovate.html">Create</a></li> <li><a href="innovate.html">Teach</a></li> </ul> </li> <li><a href="blog.html"><i class="fa fa-book"></i> Blog</a></li> <li><a href="contact.html"><i class="fa fa-hand-o-up"></i> Contact</a></li> <li class="active"><a href="team.html"><i class="fa fa-user"></i> Team</a></li> </ul> <ul class="nav navbar-nav navbar-right"> <li> <form class="navbar-form navbar-left"> <div class="form-group"> <input type="search" class="form-control" name="search" placeholder="Search" /> </div> <button type="submit" name="submit" class="btn btn-info">Search</button> </form> </li> <li><a href="#">Register</a></li> <li><a href="#">Login</a></li> </ul> </div> </div> </nav> <div class="container-fluid"> <header class="page-header"> <h3>Team..</h3> </header> <ol class="breadcrumb"> <li><a href="index.html">Home</a></li> <li class="active">Team</li> </ol> <div class="row"> <div class="col-md-8"> <div class="dropdown pad-bottom-5"> <button class="btn btn-info dropdown-toggle" type="button" data-toggle="dropdown">Department <span class="caret"></span></button> <ul class="dropdown-menu" id="department"> <li><a href="#">Acounting</a></li> <li><a href="#">Marketing</a></li> <li><a href="#">Production</a></li> <li class="divider"></li> <li class="disabled"><a href="#">HR</a></li> <li><a href="#">IT</a></li> </ul> </div> <div class="btn-toolbar"> <div class="btn-group pad-bottom-5"> <button id="left" class="btn btn-default"><i class="fa fa-align-left"></i> </button> <button id="center" class="btn btn-default"><i class="fa fa-align-center"></i></button> <button id="right" class="btn btn-default"><i class="fa fa-align-right"></i></button> </div> <div class="btn-group"> <button class="btn btn-default"><i class="fa fa-save"></i></button> <button class="btn btn-default"><b>B</b></button> <button class="btn btn-default"><i><B>I</B></i></button> <button class="btn btn-default"><u><b>U</b></u></button> </div> <div class="btn-group"> <button class="btn btn-default"><i class="fa fa-cloud-upload"></i></button> <button class="btn btn-default"><i class="fa fa-cloud-download"></i></button> </div> <div class="btn-group"> <button class="btn btn-default" id="btn_load" data-loading-text="Please Wait....." data-complete-text="Download Complete...">Data download</button> </div> </div> <div class="btn-group pad-bottom-5"> <button class="btn btn-default" type="button"><i class="fa fa-share-square-o"></i> Social</button> <button class="btn btn-danger dropdown-toggle" type="button" data-toggle="dropdown"><span class="caret"></span></button> <ul class="dropdown-menu"> <li><a href="#"><i class="fa fa-facebook-f"></i> Facebook</a></li> <li><a href="#"><i class="fa fa-youtube-play"></i> Youtube</a></li> <li><a href="#"><i class="fa fa-instagram"></i> Instagram</a></li> <li class="divider"></li> <li class="disabled"><a href="#"><i class="fa fa-line-chart"></i> Line</a></li> </ul> </div> <table class="table table-bordered table-hover table-striped table-condensed" id="team"> <thead> <tr> <th class="text-center">#</th> <th class="text-center">Name</th> <th class="text-center">Email</th> </tr> </thead> <tbody> <tr class="active"> <td class="text-center">1</td> <td>Aaaa</td> <td>A@abc.com</td> </tr> <tr class="success"> <td class="text-center">2</td> <td>Bbbb</td> <td>B@abc.com</td> </tr> <tr class="warning"> <td class="text-center">3</td> <td>Cccc</td> <td>C@abc.com</td> </tr> <tr class="danger"> <td class="text-center">4</td> <td>Dddd</td> <td>D@abc.com</td> </tr> </tbody> </table> <header class="page-header"> <h3>Images</h3> </header> <div class="col-sm-4"><img src="images/1.jpg" class="img-responsive img-circle" /></div> <div class="col-sm-4"><img src="images/2.jpg" class="img-responsive img-rounded" /></div> <div class="col-sm-4"><img src="images/3.jpg" class="img-responsive img-thumbnail" /></div> </div> <div class="col-md-4"> <header class="page-header"> <h3>Searching..</h3> </header> <form class="form-inline pad-bottom-10"> <label class="sr-only">Search</label> <input type="search" name="search" id="search" class="form-control"/> <!--<input type="submit" name="submit" value="Search" class="btn btn-success" />--> <button type="submit" name="sunmit" class="btn btn-primary"><i class="fa fa-search"></i> Search</button> </form> <div class="input-group"> <input type="text" name="search1" class="form-control" /> <div class="input-group-btn"> <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown" type="submit"><i class="fa fa-search"></i> ค้นหา <span class="caret"></span></button> <ul class="dropdown-menu"> <li><a href="#">By Name</a></li> <li><a href="#">By E-Mail</a></li> <li><a href="#">By Address</a></li> </ul> </div> </div> <header class="page-header"> <h3>Login..</h3> </header> <form> <div class="form-group"> <label for="email">E-Mail Address</label> <div class="input-group"> <span class="input-group-addon"><i class="fa fa-envelope"></i></span> <input type="email" id="email" name="email" placeholder="Enter Email" class="form-control" /> </div> </div> <div class="form-group"> <label for="pass">Password</label> <div class="input-group"> <span class="input-group-addon"><i class="fa fa-lock"></i></span> <input type="password" id="pass" name="pass" placeholder="Enter Password" class="form-control" /> </div </div> <input type="submit" name="submit" value="Login" class="btn btn-info pad-top-10"/> <!--<button type="submit" name="submit" class="btn btn-info pad-top-5">Login</button>--> </form> </div> </div> </div> <script src="Scripts/jquery-1.9.1.min.js"></script> <script src="Scripts/bootstrap.min.js"></script> <script> $("#department li a").click(function(){ alert($(this).html()) }) $("#left").click(function () { $("#team tbody td").removeClass("text-center").removeClass("text-right").addClass("text-left"); }) $("#center").click(function () { $("#team tbody td").removeClass("text-left").removeClass("text-right").addClass("text-center"); }) $("#right").click(function () { $("#team tbody td").removeClass("text-center").removeClass("text-left").addClass("text-right"); }) $("#btn_load").on("click",function(e){ e.preventDefault(); $this = $(this); $this.button("loading"); setTimeout(function () { $this.button("complete"); $this.removeClass("btn-primary").addClass("btn-success"); }, 3000); }) </script> </body> </html>
©
2018.