jQuery fade in/out is not working?

shahrzad

when you click on the button,the text should fade out and a search result should fade in.but nothing happens.i also tried jquery hide and show and indeed nothing happend.also used jquery css and had no success.

$(document).ready(function() {
  $("#searchSubmit").click(function() {
    var question = {
      q: $("#searchQuestion").val()
    }
    var data = ["mobileApp", "mobileLearning"]
    console.log(data.length)
    if (data.length == 0) {
      console.log('un')
      alertify.error("nothing found")
    } else {
      var info = {
        searchResult: data,
        serachQ: $("#searchQuestion").val()
      }
      $('.main').fadeOut();
      console.log("hey")
      document.getElementById("resultLength").innerHTML = data.length;
      document.getElementById("searchQ").innerHTML = info.serachQ;
      document.getElementsByClassName(".date").innerHTML = new Date().getDate()
      document.getElementsByClassName(".time").innerHTML = new Date().getTime()
      $('#searchPage').fadeIn();
      for (var i = 0; i < data.length; i++) {
        switch (data[i]) {
          case "smartFarming":
            $("#smartFarming").fadeIn();
            break;
          case "smartEnergyMonitoring":
            $("#smartEnergyMonitoring").fadeIn()
            break;
          case "smartIoTbasedDigitalSignage":
            $("#smartIoTBasedDigitalSignage").fadeIn();
            break;
          case "smartSurveySolutions":
            $("#smartSurvey").fadeIn()
            break;
          case "smartHydroponics":
            $("#smartHydroponics").fadeIn();
            break;
          case "smartEnvironmentalMonitoring":
            $("#smartEnvironmentalMonitoring").fadeIn();
            break;
          case "smartBuildingManagement":
            $("#smartBuildingManagement").fadeIn();
            break;
          case "invention":
            $("#skyMicsInvention").fadeIn();
            break;
          case "mobileApp":
            $("#mobileAppRobotechClub").fadeIn();
            break;
          case "mobileLearning":
            $("#mobileLearning").fadeIn();
        }
      }

    }

  })
});
@import "http://fonts.googleapis.com/css?family=Roboto:300,400,500,700";
.container {
  margin-top: 20px;
}

.mb20 {
  margin-bottom: 20px;
}

hgroup {
  padding-left: 15px;
  border-bottom: 1px solid #ccc;
}

hgroup h1 {
  font: 500 normal 1.625em "Roboto", Arial, Verdana, sans-serif;
  color: #2a3644;
  margin-top: 0;
  line-height: 1.15;
}

hgroup h2.lead {
  font: normal normal 1.125em "Roboto", Arial, Verdana, sans-serif;
  color: #2a3644;
  margin: 0;
  padding-bottom: 10px;
}

.search-result .thumbnail {
  border-radius: 0 !important;
}

.search-result:first-child {
  margin-top: 0 !important;
}

.search-result {
  margin-top: 20px;
}

.search-result .col-md-2 {
  border-right: 1px dotted #ccc;
  min-height: 140px;
}

.search-result ul {
  padding-left: 0 !important;
  list-style: none;
}

.search-result ul li {
  font: 400 normal .85em "Roboto", Arial, Verdana, sans-serif;
  line-height: 30px;
}

.search-result ul li i {
  padding-right: 5px;
}

.search-result .col-md-7 {
  position: relative;
}

.search-result h3 {
  font: 500 normal 1.375em "Roboto", Arial, Verdana, sans-serif;
  margin-top: 0 !important;
  margin-bottom: 10px !important;
}

.search-result h3>a,
.search-result i {
  color: #248dc1 !important;
}

.search-result p {
  font: normal normal 1.125em "Roboto", Arial, Verdana, sans-serif;
}

.search-result span.plus {
  position: absolute;
  right: 0;
  top: 126px;
}

.search-result span.plus a {
  background-color: #248dc1;
  padding: 5px 5px 3px 5px;
}

.search-result span.plus a:hover {
  background-color: #414141;
}

.search-result span.plus a i {
  color: #fff !important;
}

.search-result span.border {
  display: block;
  width: 97%;
  margin: 0 15px;
  border-bottom: 1px dotted #ccc;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
  <header>
    <div class="col-md-3 col-lg-3 col-xs-3">
      <div>
        <form class="navbar-form">
          <div class="input-group">
            <input type="text" id="searchQuestion" class="form-control" placeholder="Search" name="q">
            <div class="input-group-btn">
              <button class="btn btn-default" style="height: 3px!important;" id="searchSubmit"><i class="glyphicon glyphicon-search"></i></button>
            </div>
          </div>
        </form>
      </div>
    </div>

  </header>
  <div id="main" class="main">
    <p>this shoul be fade out</p>
  </div>
  <div id="searchPage" style="display: none;">
    <section class="col-xs-12 col-sm-6 col-md-12">
      <article id="smartFarming" class="search-result row" style="display: none;">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartFarming.html" title="smart farming solutions" class="thumbnail"><img src="images/banner-11-1900x570.jpg" alt="smart farming solutions" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartFarming.html" title="smart farming solutions">smart farming solutions</a></h3>
          <p>For farmers and growers, the Internet of Things has opened up extremely productive ways to cultivate soil and raise livestock with the use of affordable, easy-to-install sensors and an abundance of insightful data they offer.</p>
          <span class="plus"><a href="./html/smartFarming.html" title="smart farming solutions"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartEnergyMonitoring" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartEnergyMonitoring.html" title="smartEnergyMonitoring" class="thumbnail"><img src="images/Dashboard1.png" alt="smart farming solutions" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartEnergyMonitoring.html" title="smartEnergyMonitoring">smart Energy Monitoring</a></h3>
          <p>Real energy management requires an energy monitoring system, which means knowing how much energy you are using. If you know how much energy your home is using and when it’s using it, you can better respond to that usage and take control of your
            costs.</p>
          <span class="plus"><a href="./html/smartEnergyMonitoring.html" title="smartEnergyMonitoring"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartIoTBasedDigitalSignage" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartIoTbasedDigitalSignage.html" title="smartIoTbasedDigitalSignage" class="thumbnail"><img src="images/nahlad_final_01_603b659a0c0b9e3c3a92549c0aefc11a.jpg" alt="smartIoTbasedDigitalSignage" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartIoTbasedDigitalSignage.html" title="smart IoT based Digital Signage">smart IoT based Digital Signage</a></h3>
          <p>Smart Digital Signage Solutions is a result of SKYMICS research and development to provide an affordable but complete and versatile solution for private sectors and SMEs.</p>
          <span class="plus"><a href="./html/smartIoTbasedDigitalSignage.html" title="smart IoT based Digital Signage"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartSurvey" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartSurveySolutions.html" title="smartSurveySolutions" class="thumbnail"><img src="images/mmc-web.jpg" alt="smartSurveySolutions" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartSurveySolutions.html" title="smartSurveySolutions">smart Survey Solutions</a></h3>
          <p>
            Smart Survey Solutions allows users to quickly create intuitive, powerful, onlined question-and-answer (but there is no need for internet) surveys that can work for tens to thousands of participants without much effort.
          </p>
          <span class="plus"><a href="./html/smartSurveySolutions.html" title="smartSurveySolutions"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartHydroponics" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartHydroponics.html" title="smartHydroponics" class="thumbnail"><img src="images/Biopod_Inhabitat.jpg" alt="smartHydroponics" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartHydroponics.html" title="smartHydroponics">smart Hydroponics</a></h3>
          <p>At Skymics we have come up with the solution that can help gardeners and farmers get the most out of their efforts by using sensors that monitor the necessary factors needed for growing a plant. We designed a self-contained, automatic, connected
            hydroponic growing environment by IOT. All it needs are some seeds, water and nutrient solution</p>
          <span class="plus"><a href="./html/smartHydroponics.html" title="smartHydroponics" ><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartEnvironmentalMonitoring" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartEnvironmentalMonitoring.html" title="smartEnvironmentalMonitoring" class="thumbnail"><img src="images/DYv6dbPVMAAudpy.jpg" alt="smartEnvironmentalMonitoring" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartEnvironmentalMonitoring.html" title="smartEnvironmentalMonitoring">smart Environmental Monitoring</a></h3>
          <p>This solution helps us to collect the environmental data in different parts of the city. The data will be stored on the cloud and analysed for further use which includes forecast of the weather status, measurement of the air pollution and so
            on. Results will be used for commercial use and public benefit.
          </p>
          <span class="plus"><a href="./html/smartEnvironmentalMonitoring.html" title="smartEnvironmentalMonitoring"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartBuildingManagement" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartBuildingManagement.html" title="smartBuildingManagement" class="thumbnail"><img src="images/Smart-building-automation.jpg" alt="smartBuildingManagement" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartBuildingManagement.html" title="smartBuildingManagement">smart Building Management</a></h3>
          <p>Skymics Smart Building Management System is a new way to manage your building easier in order to increase operational and energy efficiency. Our solutions can successfully integrate, install and maintain building management systems and provide
            life cycle support for any type and scale of building. We are making it easier to increase the operational performance of the facility as well as the comfort and safety of building occupants</p>
          <span class="plus"><a href="./html/smartBuildingManagement.html" title="smartBuildingManagement"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="skyMicsInvention" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/invention.html" title="invention" class="thumbnail"><img src="images/innovation-solutions-title2.jpg" alt="invention" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/invention.html" title="invention">invention</a></h3>
          <p>65% of the world’s population has no Internet access and therefore have no opportunity to gain information and knowledge. SKYMICS E-Learning hardware solutions offers the new technology that can bring the online and electronic education to anywhere
            in the world</p>
          <span class="plus"><a href="./html/invention.html" title="invention"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="mobileAppRobotechClub" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/mobileApp.html" title="mobileApp" class="thumbnail"><img src="images/1494404290-ca13-jpg.jpg" alt="mobileApp" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/mobileApp.html" title="mobile App">mobile App</a></h3>
          <p>Today, we have a computer in our pocket that is more than 100,000 times faster than the first home computers. It is connected to every other computer on the planet and can access virtually every piece of human knowledge ever created, nearly
            instantaneously</p>
          <span class="plus"><a href="./html/mobileApp.html" title="mobile App"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="mobileLearning" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/mobileLearning.html" title="mobileLearning" class="thumbnail"><img src="images/school_tablets001-1.jpg" alt="mobileLearning" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/mobileLearning.html" title="mobile Learning">mobile Learning</a></h3>
          <p>Mobile learning solutions from Skymics can open up a world of knowledge – and possibilities.</p>
          <span class="plus"><a href=href="./html/mobileLearning.html" title="mobile Learning"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
    </section>
  </div>
  <script src="test.js"></script>

</body>

Barmar

You have several problems.

The button doesn't have a type attribute, so it defaults to type="submit" and submits the form. So you're reloading the page when you click the button. Change it to type="button" to prevent this.

These lines won't work:

  document.getElementsByClassName(".date").innerHTML = new Date().getDate()
  document.getElementsByClassName(".time").innerHTML = new Date().getTime()

getElementsByClassName returns a collection, not a single element, you can't assign to its innerHTML. Also, the argument should not include the ., that's a selector, not part of the class name. You could solve both problems by using document.querySelector, or the even shorter jquery:

$(".date").html(new Date().getDate());
$(".time").html(new Date().getTime());

There's no id="resultLength" in the HTML, so

  document.getElementById("resultLength").innerHTML = data.length;

gets an error trying to set innerHTML of null. Using jQuery it will just be ignored if selector doesn't match anything.

Here's the corrected code.

$(document).ready(function() {
  $("#searchSubmit").click(function() {
    var question = {
      q: $("#searchQuestion").val()
    }
    var data = ["mobileApp", "mobileLearning"]
    console.log(data.length)
    if (data.length == 0) {
      console.log('un')
      alertify.error("nothing found")
    } else {
      var info = {
        searchResult: data,
        serachQ: $("#searchQuestion").val()
      }
      $('.main').fadeOut();
      console.log("hey")
      $("#resultLength").html(data.length);
      $("#searchQ").html(info.serachQ);
      $(".date").html(new Date().getDate());
      $(".time").html(new Date().getTime());
      $('#searchPage').fadeIn();
      for (var i = 0; i < data.length; i++) {
        switch (data[i]) {
          case "smartFarming":
            $("#smartFarming").fadeIn();
            break;
          case "smartEnergyMonitoring":
            $("#smartEnergyMonitoring").fadeIn()
            break;
          case "smartIoTbasedDigitalSignage":
            $("#smartIoTBasedDigitalSignage").fadeIn();
            break;
          case "smartSurveySolutions":
            $("#smartSurvey").fadeIn()
            break;
          case "smartHydroponics":
            $("#smartHydroponics").fadeIn();
            break;
          case "smartEnvironmentalMonitoring":
            $("#smartEnvironmentalMonitoring").fadeIn();
            break;
          case "smartBuildingManagement":
            $("#smartBuildingManagement").fadeIn();
            break;
          case "invention":
            $("#skyMicsInvention").fadeIn();
            break;
          case "mobileApp":
            $("#mobileAppRobotechClub").fadeIn();
            break;
          case "mobileLearning":
            $("#mobileLearning").fadeIn();
        }
      }

    }

  })
});
@import "http://fonts.googleapis.com/css?family=Roboto:300,400,500,700";
.container {
  margin-top: 20px;
}

.mb20 {
  margin-bottom: 20px;
}

hgroup {
  padding-left: 15px;
  border-bottom: 1px solid #ccc;
}

hgroup h1 {
  font: 500 normal 1.625em "Roboto", Arial, Verdana, sans-serif;
  color: #2a3644;
  margin-top: 0;
  line-height: 1.15;
}

hgroup h2.lead {
  font: normal normal 1.125em "Roboto", Arial, Verdana, sans-serif;
  color: #2a3644;
  margin: 0;
  padding-bottom: 10px;
}

.search-result .thumbnail {
  border-radius: 0 !important;
}

.search-result:first-child {
  margin-top: 0 !important;
}

.search-result {
  margin-top: 20px;
}

.search-result .col-md-2 {
  border-right: 1px dotted #ccc;
  min-height: 140px;
}

.search-result ul {
  padding-left: 0 !important;
  list-style: none;
}

.search-result ul li {
  font: 400 normal .85em "Roboto", Arial, Verdana, sans-serif;
  line-height: 30px;
}

.search-result ul li i {
  padding-right: 5px;
}

.search-result .col-md-7 {
  position: relative;
}

.search-result h3 {
  font: 500 normal 1.375em "Roboto", Arial, Verdana, sans-serif;
  margin-top: 0 !important;
  margin-bottom: 10px !important;
}

.search-result h3>a,
.search-result i {
  color: #248dc1 !important;
}

.search-result p {
  font: normal normal 1.125em "Roboto", Arial, Verdana, sans-serif;
}

.search-result span.plus {
  position: absolute;
  right: 0;
  top: 126px;
}

.search-result span.plus a {
  background-color: #248dc1;
  padding: 5px 5px 3px 5px;
}

.search-result span.plus a:hover {
  background-color: #414141;
}

.search-result span.plus a i {
  color: #fff !important;
}

.search-result span.border {
  display: block;
  width: 97%;
  margin: 0 15px;
  border-bottom: 1px dotted #ccc;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
  <header>
    <div class="col-md-3 col-lg-3 col-xs-3">
      <div>
        <form class="navbar-form">
          <div class="input-group">
            <input type="text" id="searchQuestion" class="form-control" placeholder="Search" name="q">
            <div class="input-group-btn">
              <button type="button" class="btn btn-default" style="height: 3px!important;" id="searchSubmit"><i class="glyphicon glyphicon-search"></i></button>
            </div>
          </div>
        </form>
      </div>
    </div>

  </header>
  <div id="main" class="main">
    <p>this shoul be fade out</p>
  </div>
  <div id="searchPage" style="display: none;">
    <section class="col-xs-12 col-sm-6 col-md-12">
      <article id="smartFarming" class="search-result row" style="display: none;">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartFarming.html" title="smart farming solutions" class="thumbnail"><img src="images/banner-11-1900x570.jpg" alt="smart farming solutions" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartFarming.html" title="smart farming solutions">smart farming solutions</a></h3>
          <p>For farmers and growers, the Internet of Things has opened up extremely productive ways to cultivate soil and raise livestock with the use of affordable, easy-to-install sensors and an abundance of insightful data they offer.</p>
          <span class="plus"><a href="./html/smartFarming.html" title="smart farming solutions"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartEnergyMonitoring" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartEnergyMonitoring.html" title="smartEnergyMonitoring" class="thumbnail"><img src="images/Dashboard1.png" alt="smart farming solutions" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartEnergyMonitoring.html" title="smartEnergyMonitoring">smart Energy Monitoring</a></h3>
          <p>Real energy management requires an energy monitoring system, which means knowing how much energy you are using. If you know how much energy your home is using and when it’s using it, you can better respond to that usage and take control of your
            costs.</p>
          <span class="plus"><a href="./html/smartEnergyMonitoring.html" title="smartEnergyMonitoring"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartIoTBasedDigitalSignage" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartIoTbasedDigitalSignage.html" title="smartIoTbasedDigitalSignage" class="thumbnail"><img src="images/nahlad_final_01_603b659a0c0b9e3c3a92549c0aefc11a.jpg" alt="smartIoTbasedDigitalSignage" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartIoTbasedDigitalSignage.html" title="smart IoT based Digital Signage">smart IoT based Digital Signage</a></h3>
          <p>Smart Digital Signage Solutions is a result of SKYMICS research and development to provide an affordable but complete and versatile solution for private sectors and SMEs.</p>
          <span class="plus"><a href="./html/smartIoTbasedDigitalSignage.html" title="smart IoT based Digital Signage"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartSurvey" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartSurveySolutions.html" title="smartSurveySolutions" class="thumbnail"><img src="images/mmc-web.jpg" alt="smartSurveySolutions" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartSurveySolutions.html" title="smartSurveySolutions">smart Survey Solutions</a></h3>
          <p>
            Smart Survey Solutions allows users to quickly create intuitive, powerful, onlined question-and-answer (but there is no need for internet) surveys that can work for tens to thousands of participants without much effort.
          </p>
          <span class="plus"><a href="./html/smartSurveySolutions.html" title="smartSurveySolutions"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartHydroponics" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartHydroponics.html" title="smartHydroponics" class="thumbnail"><img src="images/Biopod_Inhabitat.jpg" alt="smartHydroponics" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartHydroponics.html" title="smartHydroponics">smart Hydroponics</a></h3>
          <p>At Skymics we have come up with the solution that can help gardeners and farmers get the most out of their efforts by using sensors that monitor the necessary factors needed for growing a plant. We designed a self-contained, automatic, connected
            hydroponic growing environment by IOT. All it needs are some seeds, water and nutrient solution</p>
          <span class="plus"><a href="./html/smartHydroponics.html" title="smartHydroponics" ><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartEnvironmentalMonitoring" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartEnvironmentalMonitoring.html" title="smartEnvironmentalMonitoring" class="thumbnail"><img src="images/DYv6dbPVMAAudpy.jpg" alt="smartEnvironmentalMonitoring" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartEnvironmentalMonitoring.html" title="smartEnvironmentalMonitoring">smart Environmental Monitoring</a></h3>
          <p>This solution helps us to collect the environmental data in different parts of the city. The data will be stored on the cloud and analysed for further use which includes forecast of the weather status, measurement of the air pollution and so
            on. Results will be used for commercial use and public benefit.
          </p>
          <span class="plus"><a href="./html/smartEnvironmentalMonitoring.html" title="smartEnvironmentalMonitoring"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="smartBuildingManagement" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/smartBuildingManagement.html" title="smartBuildingManagement" class="thumbnail"><img src="images/Smart-building-automation.jpg" alt="smartBuildingManagement" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/smartBuildingManagement.html" title="smartBuildingManagement">smart Building Management</a></h3>
          <p>Skymics Smart Building Management System is a new way to manage your building easier in order to increase operational and energy efficiency. Our solutions can successfully integrate, install and maintain building management systems and provide
            life cycle support for any type and scale of building. We are making it easier to increase the operational performance of the facility as well as the comfort and safety of building occupants</p>
          <span class="plus"><a href="./html/smartBuildingManagement.html" title="smartBuildingManagement"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="skyMicsInvention" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/invention.html" title="invention" class="thumbnail"><img src="images/innovation-solutions-title2.jpg" alt="invention" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/invention.html" title="invention">invention</a></h3>
          <p>65% of the world’s population has no Internet access and therefore have no opportunity to gain information and knowledge. SKYMICS E-Learning hardware solutions offers the new technology that can bring the online and electronic education to anywhere
            in the world</p>
          <span class="plus"><a href="./html/invention.html" title="invention"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="mobileAppRobotechClub" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/mobileApp.html" title="mobileApp" class="thumbnail"><img src="images/1494404290-ca13-jpg.jpg" alt="mobileApp" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/mobileApp.html" title="mobile App">mobile App</a></h3>
          <p>Today, we have a computer in our pocket that is more than 100,000 times faster than the first home computers. It is connected to every other computer on the planet and can access virtually every piece of human knowledge ever created, nearly
            instantaneously</p>
          <span class="plus"><a href="./html/mobileApp.html" title="mobile App"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
      <article id="mobileLearning" style="display: none" class="search-result row">
        <div class="col-xs-12 col-sm-12 col-md-3">
          <a href="./html/mobileLearning.html" title="mobileLearning" class="thumbnail"><img src="images/school_tablets001-1.jpg" alt="mobileLearning" /></a>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-2">
          <ul class="meta-search">
            <li><i class="glyphicon glyphicon-calendar"></i> <span class="date"></span></li>
            <li><i class="glyphicon glyphicon-time"></i> <span class="time"></span></li>
          </ul>
        </div>
        <div class="col-xs-12 col-sm-12 col-md-7 excerpet">
          <h3><a href="./html/mobileLearning.html" title="mobile Learning">mobile Learning</a></h3>
          <p>Mobile learning solutions from Skymics can open up a world of knowledge – and possibilities.</p>
          <span class="plus"><a href=href="./html/mobileLearning.html" title="mobile Learning"><i class="glyphicon glyphicon-plus"></i></a></span>
        </div>
        <span class="clearfix borda"></span>
      </article>
    </section>
  </div>
  <script src="test.js"></script>

</body>

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related