Test Scripting: 2013

Temperature 1 :	°C	Temperature 2 :	°C
Air Humidity 1:	%	Air Humidity 2:	%
Lux 1:		Lux 2:
Soil 1:		Soil2:
Soil 3:		Soil 4:
Soil 5:		Soil 6:

mercoledì 20 marzo 2013

mercoledì 13 febbraio 2013

HTML Markup for these tabs

    
<div id="tab-container" class="tab-container">
  <ul class='etabs'>
    <li class='tab'><a href="#tabs1-html">HTML Markup</a></li>
    <li class='tab'><a href="#tabs1-js">Required JS</a></li>
    <li class='tab'><a href="#tabs1-css">Example CSS</a></li>
  </ul>
  <div id="tabs1-html">
    <h2>HTML Markup for these tabs</h2>
    <!-- content -->
  </div>
  <div id="tabs1-js">
    <h2>JS for these tabs</h2>
    <!-- content -->
  </div>
  <div id="tabs1-css">
    <h2>CSS Styles for these tabs</h2>
    <!-- content -->
  </div>
</div>

The HTML markup for your tabs and content can be arranged however you want. At the minimum, you need a container, a collection of links for your tabs (an unordered list by default), and matching divs for your tabbed content. Make sure the tab href attributes match the id of the target panel. This is standard semantic markup for in-page anchors.

The class names above are just to make it easy to style. You can make them whatever you want, there's no magic here.

JS for these tabs

    
<script src="/javascripts/jquery.js" type="text/javascript"></script>
<script src="/javascripts/jquery.hashchange.js" type="text/javascript"></script>
<script src="/javascripts/jquery.easytabs.js" type="text/javascript"></script>

Optionally include the jquery hashchange plugin (recommended) or address plugin to enable forward- and back-button functionality.

    
$('#tab-container').easytabs();

CSS Styles for these tabs


    .etabs { margin: 0; padding: 0; }
.tab { display: inline-block; zoom:1; *display:inline; background: #eee; border: solid 1px #999; border-bottom: none; -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; }
.tab a { font-size: 14px; line-height: 2em; display: block; padding: 0 10px; outline: none; }
.tab a:hover { text-decoration: underline; }
.tab.active { background: #fff; padding-top: 6px; position: relative; top: 1px; border-color: #666; }
.tab a.active { font-weight: bold; }
.tab-container .panel-container { background: #fff; border: solid #666 1px; padding: 10px; -moz-border-radius: 0 4px 4px 4px; -webkit-border-radius: 0 4px 4px 4px; }

Test Scripting

mercoledì 13 novembre 2013

giovedì 26 settembre 2013

STHORTO_TEST

mercoledì 20 marzo 2013

chartjs.org

mercoledì 13 febbraio 2013

test tabs

View more demos and docs

HTML Markup for these tabs

JS for these tabs

CSS Styles for these tabs