þÿ<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" /> <title>Bootstrap3TÍ^”_TSð{¡t|û~ßj!rHMeAdmin nÑR¨ga - JSNãxQ</title> <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> <!--[if lt IE 9]> <link rel="stylesheet" type="text/css" href="plugins/jquery-ui/jquery.ui.1.10.2.ie.css" /> <![endif]--> <link href="assets/css/main.css" rel="stylesheet" type="text/css" /> <link href="assets/css/plugins.css" rel="stylesheet" type="text/css" /> <link href="assets/css/responsive.css" rel="stylesheet" type="text/css" /> <link href="assets/css/icons.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" href="assets/css/fontawesome/font-awesome.min.css"> <!--[if IE 7]> <link rel="stylesheet" href="assets/css/fontawesome/font-awesome-ie7.min.css"> <![endif]--> <!--[if IE 8]> <link href="assets/css/ie8.css" rel="stylesheet" type="text/css" /> <![endif]--> <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css'> <script type="text/javascript" src="assets/js/libs/jquery-1.10.2.min.js"> </script> <script type="text/javascript" src="plugins/jquery-ui/jquery-ui-1.10.2.custom.min.js"> </script> <script type="text/javascript" src="bootstrap/js/bootstrap.min.js"> </script> <script type="text/javascript" src="assets/js/libs/lodash.compat.min.js"> </script> <!--[if lt IE 9]> <script src="assets/js/libs/html5shiv.js"> </script> <![endif]--> <script type="text/javascript" src="plugins/touchpunch/jquery.ui.touch-punch.min.js"> </script> <script type="text/javascript" src="plugins/event.swipe/jquery.event.move.js"> </script> <script type="text/javascript" src="plugins/event.swipe/jquery.event.swipe.js"> </script> <script type="text/javascript" src="assets/js/libs/breakpoints.js"> </script> <script type="text/javascript" src="plugins/respond/respond.min.js"> </script> <script type="text/javascript" src="plugins/cookie/jquery.cookie.min.js"> </script> <script type="text/javascript" src="plugins/slimscroll/jquery.slimscroll.min.js"> </script> <script type="text/javascript" src="plugins/slimscroll/jquery.slimscroll.horizontal.min.js"> </script> <script type="text/javascript" src="plugins/sparkline/jquery.sparkline.min.js"> </script> <script type="text/javascript" src="plugins/knob/jquery.knob.min.js"> </script> <script type="text/javascript" src="plugins/daterangepicker/moment.min.js"> </script> <script type="text/javascript" src="plugins/daterangepicker/daterangepicker.js"> </script> <script type="text/javascript" src="plugins/blockui/jquery.blockUI.min.js"> </script> <script type="text/javascript" src="assets/js/app.js"> </script> <script type="text/javascript" src="assets/js/plugins.js"> </script> <script type="text/javascript" src="assets/js/plugins.form-components.js"> </script> <script> $(document).ready(function() { App.init(); Plugins.init(); FormComponents.init() }); </script> <script type="text/javascript" src="assets/js/custom.js"> </script> <script type="text/javascript" src="assets/js/demo/ui_sliders.js"> </script> </head> <body> <header class="header navbar navbar-fixed-top" role="banner"> <div class="container"> <ul class="nav navbar-nav"> <li class="nav-toggle"> <a href="javascript:void(0);" title=""> <i class="icon-reorder"> </i> </a> </li> </ul> <a class="navbar-brand" href="index.html"> <img src="assets/img/logo.png" alt="logo" /> <strong> Me </strong> Admin </a> <a href="#" class="toggle-sidebar bs-tooltip" data-placement="bottom" data-original-title="Toggle navigation"> <i class="icon-reorder"> </i> </a> <ul class="nav navbar-nav navbar-left hidden-xs hidden-sm"> <li> <a href="#"> Dashboard </a> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> Dropdown <i class="icon-caret-down small"> </i> </a> <ul class="dropdown-menu"> <li> <a href="#"> <i class="icon-user"> </i> Example #1 </a> </li> <li> <a href="#"> <i class="icon-calendar"> </i> Example #2 </a> </li> <li class="divider"> </li> <li> <a href="#"> <i class="icon-tasks"> </i> Example #3 </a> </li> </ul> </li> </ul> <ul class="nav navbar-nav navbar-right"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> <i class="icon-warning-sign"> </i> <span class="badge"> 5 </span> </a> <ul class="dropdown-menu extended notification"> <li class="title"> <p> You have 5 new notifications </p> </li> <li> <a href="javascript:void(0);"> <span class="label label-success"> <i class="icon-plus"> </i> </span> <span class="message"> New user registration. </span> <span class="time"> 1 mins </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="label label-danger"> <i class="icon-warning-sign"> </i> </span> <span class="message"> High CPU load on cluster #2. </span> <span class="time"> 5 mins </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="label label-success"> <i class="icon-plus"> </i> </span> <span class="message"> New user registration. </span> <span class="time"> 10 mins </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="label label-info"> <i class="icon-bullhorn"> </i> </span> <span class="message"> New items are in queue. </span> <span class="time"> 25 mins </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="label label-warning"> <i class="icon-bolt"> </i> </span> <span class="message"> Disk space to 85% full. </span> <span class="time"> 55 mins </span> </a> </li> <li class="footer"> <a href="javascript:void(0);"> View all notifications </a> </li> </ul> </li> <li class="dropdown hidden-xs hidden-sm"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> <i class="icon-tasks"> </i> <span class="badge"> 7 </span> </a> <ul class="dropdown-menu extended notification"> <li class="title"> <p> You have 7 pending tasks </p> </li> <li> <a href="javascript:void(0);"> <span class="task"> <span class="desc"> Preparing new release </span> <span class="percent"> 30% </span> </span> <div class="progress progress-small"> <div style="width: 30%;" class="progress-bar progress-bar-info"> </div> </div> </a> </li> <li> <a href="javascript:void(0);"> <span class="task"> <span class="desc"> Change management </span> <span class="percent"> 80% </span> </span> <div class="progress progress-small progress-striped active"> <div style="width: 80%;" class="progress-bar progress-bar-danger"> </div> </div> </a> </li> <li> <a href="javascript:void(0);"> <span class="task"> <span class="desc"> Mobile development </span> <span class="percent"> 60% </span> </span> <div class="progress progress-small"> <div style="width: 60%;" class="progress-bar progress-bar-success"> </div> </div> </a> </li> <li> <a href="javascript:void(0);"> <span class="task"> <span class="desc"> Database migration </span> <span class="percent"> 20% </span> </span> <div class="progress progress-small"> <div style="width: 20%;" class="progress-bar progress-bar-warning"> </div> </div> </a> </li> <li class="footer"> <a href="javascript:void(0);"> View all tasks </a> </li> </ul> </li> <li class="dropdown hidden-xs hidden-sm"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> <i class="icon-envelope"> </i> <span class="badge"> 1 </span> </a> <ul class="dropdown-menu extended notification"> <li class="title"> <p> You have 3 new messages </p> </li> <li> <a href="javascript:void(0);"> <span class="photo"> <img src="assets/img/demo/avatar-1.jpg" alt="" /> </span> <span class="subject"> <span class="from"> Bob Carter </span> <span class="time"> Just Now </span> </span> <span class="text"> Consetetur sadipscing elitr... </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="photo"> <img src="assets/img/demo/avatar-2.jpg" alt="" /> </span> <span class="subject"> <span class="from"> Jane Doe </span> <span class="time"> 45 mins </span> </span> <span class="text"> Sed diam nonumy... </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="photo"> <img src="assets/img/demo/avatar-3.jpg" alt="" /> </span> <span class="subject"> <span class="from"> Patrick Nilson </span> <span class="time"> 6 hours </span> </span> <span class="text"> No sea takimata sanctus... </span> </a> </li> <li class="footer"> <a href="javascript:void(0);"> View all messages </a> </li> </ul> </li> <li> <a href="#" class="dropdown-toggle row-bg-toggle"> <i class="icon-resize-vertical"> </i> </a> </li> <li class="dropdown"> <a href="#" class="project-switcher-btn dropdown-toggle"> <i class="icon-folder-open"> </i> <span> Projects </span> </a> </li> <li class="dropdown user"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> <i class="icon-male"> </i> <span class="username"> John Doe </span> <i class="icon-caret-down small"> </i> </a> <ul class="dropdown-menu"> <li> <a href="pages_user_profile.html"> <i class="icon-user"> </i> My Profile </a> </li> <li> <a href="pages_calendar.html"> <i class="icon-calendar"> </i> My Calendar </a> </li> <li> <a href="#"> <i class="icon-tasks"> </i> My Tasks </a> </li> <li class="divider"> </li> <li> <a href="login.html"> <i class="icon-key"> </i> Log Out </a> </li> </ul> </li> </ul> </div> <div id="project-switcher" class="container project-switcher"> <div id="scrollbar"> <div class="handle"> </div> </div> <div id="frame"> <ul class="project-list"> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-desktop"> </i> </span> <span class="title"> Lorem ipsum dolor </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-compass"> </i> </span> <span class="title"> Dolor sit invidunt </span> </a> </li> <li class="current"> <a href="javascript:void(0);"> <span class="image"> <i class="icon-male"> </i> </span> <span class="title"> Consetetur sadipscing elitr </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-thumbs-up"> </i> </span> <span class="title"> Sed diam nonumy </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-female"> </i> </span> <span class="title"> At vero eos et </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-beaker"> </i> </span> <span class="title"> Sed diam voluptua </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-desktop"> </i> </span> <span class="title"> Lorem ipsum dolor </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-compass"> </i> </span> <span class="title"> Dolor sit invidunt </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-male"> </i> </span> <span class="title"> Consetetur sadipscing elitr </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-thumbs-up"> </i> </span> <span class="title"> Sed diam nonumy </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-female"> </i> </span> <span class="title"> At vero eos et </span> </a> </li> <li> <a href="javascript:void(0);"> <span class="image"> <i class="icon-beaker"> </i> </span> <span class="title"> Sed diam voluptua </span> </a> </li> </ul> </div> </div> </header> <div id="container"> <div id="sidebar" class="sidebar-fixed"> <div id="sidebar-content"> <form class="sidebar-search"> <div class="input-box"> <button type="submit" class="submit"> <i class="icon-search"> </i> </button> <span> <input type="text" placeholder="Search..."> </span> </div> </form> <div class="sidebar-search-results"> <i class="icon-remove close"> </i> <div class="title"> Documents </div> <ul class="notifications"> <li> <a href="javascript:void(0);"> <div class="col-left"> <span class="label label-info"> <i class="icon-file-text"> </i> </span> </div> <div class="col-right with-margin"> <span class="message"> <strong> John Doe </strong> received $1.527,32 </span> <span class="time"> finances.xls </span> </div> </a> </li> <li> <a href="javascript:void(0);"> <div class="col-left"> <span class="label label-success"> <i class="icon-file-text"> </i> </span> </div> <div class="col-right with-margin"> <span class="message"> My name is <strong> John Doe </strong> ... </span> <span class="time"> briefing.docx </span> </div> </a> </li> </ul> <div class="title"> Persons </div> <ul class="notifications"> <li> <a href="javascript:void(0);"> <div class="col-left"> <span class="label label-danger"> <i class="icon-female"> </i> </span> </div> <div class="col-right with-margin"> <span class="message"> Jane <strong> Doe </strong> </span> <span class="time"> 21 years old </span> </div> </a> </li> </ul> </div> <ul id="nav"> <li> <a href="index.html"> <i class="icon-dashboard"> </i> Dashboard </a> </li> <li class="current open"> <a href="javascript:void(0);"> <i class="icon-desktop"> </i> UI Features <span class="label label-info pull-right"> 6 </span> </a> <ul class="sub-menu"> <li> <a href="ui_general.html"> <i class="icon-angle-right"> </i> General </a> </li> <li> <a href="ui_buttons.html"> <i class="icon-angle-right"> </i> Buttons </a> </li> <li> <a href="ui_tabs_accordions.html"> <i class="icon-angle-right"> </i> Tabs &amp; Accordions </a> </li> <li class="current"> <a href="ui_sliders.html"> <i class="icon-angle-right"> </i> Sliders </a> </li> <li> <a href="ui_nestable_list.html"> <i class="icon-angle-right"> </i> Nestable List </a> </li> <li> <a href="ui_typography.html"> <i class="icon-angle-right"> </i> Typography / Icons </a> </li> <li> <a href="ui_google_maps.html"> <i class="icon-angle-right"> </i> Google Maps </a> </li> <li> <a href="ui_grid.html"> <i class="icon-angle-right"> </i> Grid </a> </li> </ul> </li> <li> <a href="javascript:void(0);"> <i class="icon-edit"> </i> Form Elements </a> <ul class="sub-menu"> <li> <a href="form_components.html"> <i class="icon-angle-right"> </i> Form Components </a> </li> <li> <a href="form_layouts.html"> <i class="icon-angle-right"> </i> Form Layouts </a> </li> <li> <a href="form_validation.html"> <i class="icon-angle-right"> </i> Form Validation </a> </li> <li> <a href="form_wizard.html"> <i class="icon-angle-right"> </i> Form Wizard </a> </li> </ul> </li> <li> <a href="javascript:void(0);"> <i class="icon-table"> </i> Tables </a> <ul class="sub-menu"> <li> <a href="tables_static.html"> <i class="icon-angle-right"> </i> Static Tables </a> </li> <li> <a href="http://envato.stammtec.de/themeforest/melon/tables_dynamic.html"> <i class="icon-angle-right"> </i> Dynamic Tables (DataTables) </a> </li> <li> <a href="tables_responsive.html"> <i class="icon-angle-right"> </i> Responsive Tables </a> </li> </ul> </li> <li> <a href="charts.html"> <i class="icon-bar-chart"> </i> Charts &amp; Statistics </a> </li> <li> <a href="javascript:void(0);"> <i class="icon-folder-open-alt"> </i> Pages </a> <ul class="sub-menu"> <li> <a href="login.html"> <i class="icon-angle-right"> </i> Login </a> </li> <li> <a href="pages_user_profile.html"> <i class="icon-angle-right"> </i> User Profile </a> </li> <li> <a href="pages_calendar.html"> <i class="icon-angle-right"> </i> Calendar </a> </li> <li> <a href="pages_invoice.html"> <i class="icon-angle-right"> </i> Invoice </a> </li> <li> <a href="404.html"> <i class="icon-angle-right"> </i> 404 Page </a> </li> </ul> </li> <li> <a href="javascript:void(0);"> <i class="icon-list-ol"> </i> 4 Level Menu </a> <ul class="sub-menu"> <li class="open-default"> <a href="javascript:void(0);"> <i class="icon-cogs"> </i> Item 1 <span class="arrow"> </span> </a> <ul class="sub-menu"> <li class="open-default"> <a href="javascript:void(0);"> <i class="icon-user"> </i> Sample Link 1 <span class="arrow"> </span> </a> <ul class="sub-menu"> <li class="current"> <a href="javascript:void(0);"> <i class="icon-remove"> </i> Sample Link 1 </a> </li> <li> <a href="javascript:void(0);"> <i class="icon-pencil"> </i> Sample Link 1 </a> </li> <li> <a href="javascript:void(0);"> <i class="icon-edit"> </i> Sample Link 1 </a> </li> </ul> </li> <li> <a href="javascript:void(0);"> <i class="icon-user"> </i> Sample Link 1 </a> </li> <li> <a href="javascript:void(0);"> <i class="icon-external-link"> </i> Sample Link 2 </a> </li> <li> <a href="javascript:void(0);"> <i class="icon-bell"> </i> Sample Link 3 </a> </li> </ul> </li> <li> <a href="javascript:void(0);"> <i class="icon-globe"> </i> Item 2 <span class="arrow"> </span> </a> <ul class="sub-menu"> <li> <a href="javascript:void(0);"> <i class="icon-user"> </i> Sample Link 1 </a> </li> <li> <a href="javascript:void(0);"> <i class="icon-external-link"> </i> Sample Link 1 </a> </li> <li> <a href="javascript:void(0);"> <i class="icon-bell"> </i> Sample Link 1 </a> </li> </ul> </li> <li> <a href="javascript:void(0);"> <i class="icon-folder-open"> </i> Item 3 </a> </li> </ul> </li> </ul> <div class="sidebar-title"> <span> Notifications </span> </div> <ul class="notifications demo-slide-in"> <li style="display: none;"> <div class="col-left"> <span class="label label-danger"> <i class="icon-warning-sign"> </i> </span> </div> <div class="col-right with-margin"> <span class="message"> Server <strong> #512 </strong> crashed. </span> <span class="time"> few seconds ago </span> </div> </li> <li style="display: none;"> <div class="col-left"> <span class="label label-info"> <i class="icon-envelope"> </i> </span> </div> <div class="col-right with-margin"> <span class="message"> <strong> John </strong> sent you a message </span> <span class="time"> few second ago </span> </div> </li> <li> <div class="col-left"> <span class="label label-success"> <i class="icon-plus"> </i> </span> </div> <div class="col-right with-margin"> <span class="message"> <strong> Emma </strong> 's account was created </span> <span class="time"> 4 hours ago </span> </div> </li> </ul> <div class="sidebar-widget align-center"> <div class="btn-group" data-toggle="buttons" id="theme-switcher"> <label class="btn active"> <input type="radio" name="theme-switcher" data-theme="bright"> <i class="icon-sun"> </i> Bright </label> <label class="btn"> <input type="radio" name="theme-switcher" data-theme="dark"> <i class="icon-moon"> </i> Dark </label> </div> </div> </div> <div id="divider" class="resizeable"> </div> </div> <div id="content"> <div class="container"> <div class="crumbs"> <ul id="breadcrumbs" class="breadcrumb"> <li> <i class="icon-home"> </i> <a href="index.html"> Dashboard </a> </li> <li class="current"> <a href="pages_calendar.html" title=""> Calendar </a> </li> </ul> <ul class="crumb-buttons"> <li> <a href="charts.html" title=""> <i class="icon-signal"> </i> <span> Statistics </span> </a> </li> <li class="dropdown"> <a href="#" title="" data-toggle="dropdown"> <i class="icon-tasks"> </i> <span> Users <strong> (+3) </strong> </span> <i class="icon-angle-down left-padding"> </i> </a> <ul class="dropdown-menu pull-right"> <li> <a href="form_components.html" title=""> <i class="icon-plus"> </i> Add new User </a> </li> <li> <a href="http://envato.stammtec.de/themeforest/melon/tables_dynamic.html" title=""> <i class="icon-reorder"> </i> Overview </a> </li> </ul> </li> <li class="range"> <a href="#"> <i class="icon-calendar"> </i> <span> </span> <i class="icon-angle-down"> </i> </a> </li> </ul> </div> <div class="page-header"> <div class="page-title"> <h3> Sliders </h3> <span> Good morning, John! </span> </div> <ul class="page-stats"> <li> <div class="summary"> <span> New orders </span> <h3> 17,561 </h3> </div> <div id="sparkline-bar" class="graph sparkline hidden-xs"> 20,15,8,50,20,40,20,30,20,15,30,20,25,20 </div> </li> <li> <div class="summary"> <span> My balance </span> <h3> $21,561.21 </h3> </div> <div id="sparkline-bar2" class="graph sparkline hidden-xs"> 20,15,8,50,20,40,20,30,20,15,30,20,25,20 </div> </li> </ul> </div> <div class="row"> <div class="col-md-12"> <div class="widget box"> <div class="widget-header"> <h4> <i class="icon-reorder"> </i> Sliders </h4> <div class="toolbar no-padding"> <div class="btn-group"> <span class="btn btn-xs widget-collapse"> <i class="icon-angle-down"> </i> </span> </div> </div> </div> <div class="widget-content form-horizontal row-border"> <div class="form-group"> <label class="col-md-2 col-md-2 control-label"> Default slider: </label> <div class="col-md-10"> <div id="slider-default"> </div> </div> </div> <div class="form-group"> <label class="col-md-2 control-label"> Snap to increments: </label> <div class="col-md-10"> <div class="slider-controls slider-value-top"> Donation amount ($50 increments): <span id="slider-snap-inc-amount"> </span> </div> <div id="slider-snap-inc"> </div> </div> </div> <div class="form-group"> <label class="col-md-2 control-label"> Range slider: </label> <div class="col-md-10"> <div class="slider-controls slider-value-top"> Price range: <span id="slider-range-amount"> </span> </div> <div id="slider-range"> </div> </div> </div> <div class="form-group"> <label class="col-md-2 control-label"> Range with fixed minimum: </label> <div class="col-md-10"> <div class="slider-controls slider-value-top"> Maximum price: <span id="slider-range-min-amount"> </span> </div> <div id="slider-range-min"> </div> </div> </div> <div class="form-group"> <label class="col-md-2 control-label"> Range with fixed maximum: </label> <div class="col-md-10"> <div class="slider-controls slider-value-top"> Minimum price: <span id="slider-range-max-amount"> </span> </div> <div id="slider-range-max"> </div> </div> </div> <div class="form-group"> <label class="col-md-2 control-label"> Multiple verical sliders: </label> <div class="col-md-10"> <div id="slider-vertical-multiple" class="slider-eq"> <span> 88 </span> <span> 77 </span> <span> 55 </span> <span> 33 </span> <span> 40 </span> <span> 45 </span> <span> 90 </span> <span> 40 </span> <span> 60 </span> <span> 20 </span> </div> </div> </div> <div class="form-group"> <label class="col-md-2 control-label"> Vertical range with fixed minimum: </label> <div class="col-md-10"> <div class="slider-controls slider-value-top"> Maximum price: <span id="slider-vertical-range-min-amount"> </span> </div> <div id="slider-vertical-range-min"> </div> </div> </div> </div> </div> </div> </div> <div class="row"> <div class="col-md-12"> <div class="widget box"> <div class="widget-header"> <h4> <i class="icon-reorder"> </i> Circle Dials </h4> <div class="toolbar no-padding"> <div class="btn-group"> <span class="btn btn-xs widget-collapse"> <i class="icon-angle-down"> </i> </span> </div> </div> </div> <div class="widget-content align-center"> <div class="row"> <div class="col-md-12"> <div class="alert alert-warning fade in"> <i class="icon-remove close" data-dismiss="alert"> </i> The Circle Dial plugin is not compatible with Internet Explorer 8 and older. </div> </div> </div> <div class="row"> <div class="col-md-4"> <h5> Disable display input </h5> <input class="knob" data-width="100" data-displayInput="false" value="35"> </div> <div class="col-md-4"> <h5> Cursor Mode </h5> <input class="knob" data-width="150" data-cursor="true" data-fgColor="#8fc556" data-thickness=".3" value="29"> </div> <div class="col-md-4"> <h5> Display previous value </h5> <input class="knob" data-width="200" data-min="-100" data-displayPrevious="true" value="44"> </div> </div> <div class="row"> <div class="col-md-4"> <h5> Angle offset </h5> <input class="knob" data-angleOffset="90" value="35"> </div> <div class="col-md-4"> <h5> Angle offset and arc </h5> <input class="knob" data-angleOffset="-125" data-angleArc="250" data-fgColor="#e25856" value="35"> </div> <div class="col-md-4"> <h5> 5-digit values </h5> <input class="knob" data-min="-15000" data-max="15000" value="-11000"> </div> </div> </div> </div> </div> </div> </div> </div> </div> <script type="text/javascript"> if (location.host == "envato.stammtec.de" || location.host == "themes.stammtec.de") { var _paq = _paq || []; _paq.push(["trackPageView"]); _paq.push(["enableLinkTracking"]); (function() { var a = (("https:" == document.location.protocol) ? "https": "http") + "://analytics.stammtec.de/"; _paq.push(["setTrackerUrl", a + "piwik.php"]); _paq.push(["setSiteId", "17"]); var e = document, c = e.createElement("script"), b = e.getElementsByTagName("script")[0]; c.type = "text/javascript"; c.defer = true; c.async = true; c.src = a + "piwik.js"; b.parentNode.insertBefore(c, b) })() }; </script> </body> </html>