%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /home/tjamichg/intranet.tjamich.gob.mx/intranet/common/vendors/jplist/html/
Upload File :
Create Path :
Current File : /home/tjamichg/intranet.tjamich.gob.mx/intranet/common/vendors/jplist/html/demo.html

<!doctype html>
<html>
    <head>
		
	<title>jPList - jQuery Data Grid Controls - Demos</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1" />

	    <!-- css -->
		<link href="http://fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css" />
		<link href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet" />
        <link rel="stylesheet" href="../html/css/vendor/normalize.css" />
		<link rel="stylesheet" href="../html/css/styles.min.css" />
        <link href="../html/img/common/favicon.png" rel="shortcut icon" />
				
		
		<!-- js -->		
        <script src="../html/js/vendor/jquery-1.10.0.min.js"></script>
		<script src="../html/js/vendor/modernizr.min.js"></script>
		
		
    </head>
    <body>
	
		<!-- black top bar -->
		<div class="box" id="black-top-bar">
			<div class="center">			
                <div class="box">
				
					<!-- left menu -->
                    <ul class="hmenu left iphone-hidden" id="black-top-bar-left-menu">
                        <li><a href="https://github.com/no81no/jplist/issues?state=open" title=""><i class="fa fa-asterisk"></i> Request a feature / <i class="fa fa-bug"></i> Report a bug</a></li>
                    </ul>
					
					<!-- social menu -->
					<ul class="hmenu right" id="social-menu">
						<li>
							<a href="https://www.facebook.com/jplist" title=""><i class="fa fa-facebook"></i>&nbsp;</a>
						</li>
						<li>
							<a href="https://plus.google.com/+Jplistjs" title=""><i class="fa fa-google-plus"></i></a>
						</li>						
						<li>
							<a href="https://github.com/no81no/jplist" title=""><i class="fa fa-github"></i></a>
						</li>
					</ul>
				</div>
			</div>
		</div>
				
		<!-- header -->
		<header class="box" id="header">
			<div class="box" id="header-box">
				<div class="center">			
					<div class="box">

						<!-- logo -->
						<div id="logo" class="left">	
							<img src="http://jplist.com/content/img/common/rocket.png" alt="" title="" />
							<a href="/" title="">jPList - jQuery Data Grid Controls</a>
						</div>
						
						<!-- main navigation -->
						<ul class="default-menu hmenu right" id="top-menu">	
							<li><a title="" href="mailto:no81no@gmail.com"><i class="fa fa-envelope"></i> Contacts</a></li>
							<li><a title="" href="mailto:no81no@gmail.com" class="orange"><i class="fa fa-coffee"></i> Freelance</a></li>
						</ul>

					</div>
				</div>					
			</div>
		</header>
		
		<!-- bread crumbs-->
		<div id="bread-crumbs-box" class="box">
			<div id="bread-crumbs" class="box">
			
				<div class="center">
					<div class="box text-shadow">
						<p>
							
	<a title="" href="../index.html">Home</a> &raquo; Demo
						</p>
					</div>
				</div>
			</div>
		</div>
		
		<!-- main content -->
		<div class="box">
			<div class="center">
				<div class="box">

					<!-- tabs navigation -->
					<ul class="default-menu hmenu left box">	
							
						<li>
							<a title="" href="../index.html"><i class="fa fa-home"></i> Overview</a>
						</li>
							
						<li class="active">
							<a title="" href="../html/demo.html"><i class="fa fa-picture-o"></i> Demo</a>
						</li>
							<li>
								<a title="" href="http://jplist.com/home/usage"><i class="fa fa-wrench"></i> Usage <i class="fa fa-external-link"></i></a>
							</li>
							<li>
								<a title="" href="http://jplist.com/home/js-settings"><i class="fa fa-cog"></i> JS Settings <i class="fa fa-external-link"></i></a>
							</li>
							<li>
								<a title="" href="http://jplist.com/home/controls"><i class="fa fa-th"></i> Controls <i class="fa fa-external-link"></i></a>
							</li>
							<li>
								<a title="" href="http://jplist.com/home/changelog"><i class="fa fa-clock-o"></i> Changelog <i class="fa fa-external-link"></i></a>
							</li>
							<li>
								<a title="" href="http://jplist.com/home/download" class="orange"><i class="fa fa-download"></i> Download <i class="fa fa-external-link"></i></a>
							</li>
					</ul>	
					
				</div>
			</div>
		</div>	
		
		
<div class="box">						
	<div class="center">
		<div class="box text-shadow">
			<h1 class="h1-30-normal left">jPList Demo Pages</h1>
		</div>
		
		<div class="box text-shadow fa-list-styles">
					
			<h2 class="p-lr-20">Layout Examples</h2>
			
			<ul class="arrows-menu">				
				<li><a href="examples/1-layout/div-layout.html" title="">DIVs Layout Demo</a> - demo with DIV elements and all default actions like sort, pagination, etc.</li>
				<li><a href="examples/1-layout/table-1.html" title="">Table Demo 1</a> - demo with all default actions like sort, pagination, etc. in TABLE</li>
				<li><a href="examples/1-layout/table-2.html" title="">Table Demo 2</a> - table with header and alternating rows with different colors</li>
				<li><a href="examples/1-layout/two-tables.html" title="">2 Tables on the Page</a> - demo with 2 tables on the page and all default actions like sort, pagination, etc.</li>
				<li><a href="examples/1-layout/ul-li.html" title="">UL LI Demo</a> - unordered list demo with all default actions like sort, pagination, etc. <strong>Added views control.</strong></li>
				<li><a href="examples/1-layout/list-grid.html" title="">Views Control (List, Grid and Thumbs Views)</a> - demo with control that switches between views: list, grid or thumbs</li>
				<li><a href="examples/1-layout/sticky-panel.html" title="">Demo With Sticky Panel</a> - demo with sticky panel</li>
			</ul>   
			
			<h2 class="p-lr-20">Data Sources</h2>
			<ul class="arrows-menu">
				<li><a href="examples/7-data-source/php-mysql-demo.html" title="">PHP + MySQL + HTML Example</a> - server side demo using PHP and MySQL database</li>
				<li><a href="examples/7-data-source/php-mysql-json-handlebars-demo.html" title="">PHP + MySQL + JSON + Handlebars <img src="img/icons/new.png" /></a> - server side demo using PHP, MySQL database with JSON format and Handlebars Template</li>
				<li><a href="examples/7-data-source/php-mysql-json-mustache-demo.html" title="">PHP + MySQL + JSON + Mustache <img src="img/icons/new.png" /></a> - server side demo using PHP, MySQL database with JSON format and Mustache Template</li>
				<li><a href="examples/7-data-source/php-mysql-xml-xslt-demo.html" title="">PHP + MySQL + XML + XSLT <img src="img/icons/new.png" /></a> - server side demo using PHP, MySQL database with XML format and XSLT Template</li>
				<li><a href="examples/7-data-source/asp-net-sql-server-demo.html" title="">ASP.NET and SQL Server Demo</a> - server side demo using AP.NET and SQL Server database</li>
				<li><a href="examples/7-data-source/php-sqlite-demo.html" title="">PHP + SQLite Example</a> - server side demo using PHP and SQLite database</li>
			</ul>

			<h2 class="p-lr-20">Actions Examples</h2>
			 
			<ul class="arrows-menu">
				<li><a href="examples/4-actions/drop-down-filters-ul-li.html" title="">Dropdown Filters With UL/LI</a> - filter by jQuery path dropdown with UL/LI layout</li>
				<li><a href="examples/4-actions/drop-down-filters-select.html" title="">Dropdown Filters With SELECT</a> - filter by jQuery path dropdown with SELECT layout</li>
				<li><a href="examples/4-actions/double-sort.html" title="">Double Sort Demo</a> - example with double sorting</li>
				<li><a href="examples/4-actions/deep-linking.html" title="">Deep Linking Demo</a> - page state controlled by URL</li>
				<li><a href="examples/4-actions/pagination-only-demo.html" title="">Pagination Only Demo</a> - demo page with pagination control only</li>
				<li><a href="examples/4-actions/google-style-pagination.html" title="">Google Style Pagination</a></li>							
				<li><a href="examples/4-actions/pagination-without-items-per-page.html" title="">Pagination Without "Items per Page" Dropdown</a></li>
				<li><a href="examples/4-actions/hidden-sort.html" title="">Hidden Sort (Default Sort Control)</a></li>
			</ul>

			<h2 class="p-lr-20">Toggle Filters by jQuery Path</h2>
			<ul class="arrows-menu">				
				<li><a href="examples/3-toggle-filters/checkbox-filters.html" title="">Checkbox Filters</a> - filter by jQuery path using group of checkboxes. OR logic inside group, AND logic between different groups</li>				
				<li><a href="examples/3-toggle-filters/radio-buttons-filters.html" title="">Radio Button Filters</a> - filter by jQuery path with radio buttons</li>
				<li><a href="examples/3-toggle-filters/button-filters-input.html" title="">Button Filters</a> - filter by jQuery path with BUTTON elements</li>                           
				<li><a href="examples/3-toggle-filters/button-filters-span-group.html" title="">Button Filters Group</a> - filter by jQuery path using group of elements like SPAN, INPUT, etc. OR logic inside group, AND logic between different groups</li>
				 <li><a href="examples/3-toggle-filters/button-filters-span-group-single-mode.html" title="">Button Filters Group (Single Mode) <img src="img/icons/new.png" /></a> - button filters group when only one button can be selected at the same time</li>
				<li><a href="examples/3-toggle-filters/button-filters-span.html" title="">Button Filters and Counters</a> - filter by jQuery path with SPAN elements and counter controls</li>
				<li><a href="examples/3-toggle-filters/range-filter.html" title="">Range Filter</a> - range filter by jQuery path with any element (SPAN, INPUT, etc.) </li>
			</ul>
			
			<h2 class="p-lr-20">Toggle Filters by Text</h2>
			<ul class="arrows-menu">		
				<li><a href="examples/3-toggle-filters/checkbox-text-filter.html" title="">Checkbox Text filter</a> - filter by checkboxes text values. OR logic inside group, AND logic between different groups</li>
				<li><a href="examples/3-toggle-filters/button-text-filter.html" title="">Button Text Filter</a> - filter by text using any elements like SPAN, INPUT etc.</li>
				<li><a href="examples/3-toggle-filters/button-text-filter-group.html" title="">Button Text Filter Group</a> - filter by text using any elements like SPAN, INPUT etc. OR logic inside group, AND logic between different groups</li>
			</ul>
			
			<h2 class="p-lr-20">jPList with jQuery UI</h2>
			
			<ul class="arrows-menu">							
				<li><a href="examples/5-jquery-ui/range-slider.html" title="">Range Slider</a> - jQuery UI range slider</li>
				<li><a href="examples/5-jquery-ui/date-picker-range-filter.html" title="">Date Picker Filter</a> - jQuery UI date picker</li>
			</ul>	 

			<h2 class="p-lr-20">DateTime Examples</h2>
			
			<ul class="arrows-menu">
				<li><a href="examples/2-datetime/datetime-1.html" title="">DateTime 1</a> - {day}.{month}.{year}</li>
				<li><a href="examples/2-datetime/datetime-2.html" title="">DateTime 2</a> - {month} {day}, {year} {hour}:{min}:{sec}</li>
				<li><a href="examples/2-datetime/datetime-3.html" title="">DateTime 3</a> - {month} {day}, {year}</li>
			</ul>	 

			<h2 class="p-lr-20">Other Examples</h2>
			
			<ul class="arrows-menu">
				<li><a href="examples/6-other/fade-animation.html" title="">Fade Animation</a> - example page of fade animation in jPList</li>
				<li><a href="examples/6-other/jplist-with-fancybox.html" title="">jPList with Fancybox</a> - example of jPList with lightbox</li>
				<li><a href="examples/6-other/large-amount-of-data-demo.html" title="">Large Amount of Data (Demo with 1000 items on the page)</a></li>
			</ul>	 
			
		</div>
	
	</div>
</div>
		
		<!-- footer -->
		<footer class="box" id="footer">
			<div class="center">	
            		
                <!-- footer top row -->
                <div class="box footer-top-row">
				
                    <div class="left box-30">
                        <ul class="vmenu-2">
                            <li class="header">Support/Help</li>
                            <li><a href="https://github.com/no81no/jplist/issues?state=open" title=""><i class="fa fa-asterisk"></i> Request a feature</a></li>
                            <li><a href="https://github.com/no81no/jplist/issues?state=open" title=""><i class="fa fa-bug"></i> Report a bug</a></li>
                            <li><a href="https://github.com/no81no/jplist" title=""><i class="fa fa-github"></i> Download on GitHub</a></li>
                            <li><a href="http://www.binpress.com/app/jplist-jquery-data-grid-controls/2085?ad=34027"><i class="fa fa-shopping-cart"></i> Get commercial license</a></li>
                            <li><a href="mailto:no81no@gmail.com" title=""><i class="fa fa-envelope"></i> Contact us</a></li>
                        </ul>
                    </div>

                    <div class="left box-30">
                        <ul class="vmenu-2">
                            <li class="header">Follow jPList</li>
                            <!--li><a href="" title="">Follow us on Twitter</a></li-->
                            <li><a href="https://www.facebook.com/jplist" title=""><i class="fa fa-facebook"></i>&nbsp;&nbsp; Be a fan on Facebook</a></li>
                            <li><a href="https://plus.google.com/+Jplistjs" title=""><i class="fa fa-google-plus"></i> Follow us on Google+</a></li>
                        </ul>
                    </div>

                    <div class="right box-30 binpress-banner">
                        <a href="http://www.binpress.com?u=34027" title="Binpress - Frameworks, libraries, SDKs and Open-Source projects">
                            <img src="http://cdn.binpress.com/binpress-1-dark.png" alt="Binpress - Cut your development time and costs in half" width="280" height="58" style="border:none;" />
                        </a>
                    </div>
                </div>
			</div>

            <!-- footer bottom row -->
            <div class="box footer-bot-row">
                <div class="center">	
                    
                    <div class="box">
					    <p class="align-center" id="footer-content">
						    Copyright &copy;  2014 <a href="mailto:no81no@gmail.com" title="">Miriam Zusin.</a>
					    </p>					
				    </div>

                </div>
            </div>
		</footer>	
		
    </body>
</html>

Zerion Mini Shell 1.0