Difference between revisions of "Team:TecCEM/Collaborations"

Line 1,389: Line 1,389:
 
 
 
<div id="colaboracionarg" class="hidden_colaboration">
 
<div id="colaboracionarg" class="hidden_colaboration">
−
<h2>Argentina</h2>
+
<h2>Meetup Latam 2021</h2>
−
<img src="https://static.igem.org/mediawiki/2021/9/9f/T--TecCEM--FotoEquipoTexem.jpg" alt="">
+
<p style="font-family: 'Roboto', sans-serif; text-align: justify-all; font-size: 1.2rem;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam, doloremque, fugiat. Illum modi tempora fugiat! A, dicta eligendi laborum recusandae, repudiandae, tempore perferendis non nostrum dolor enim ex reiciendis dolore.</p>
−
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magni laboriosam, voluptates veritatis debitis dicta et ratione quidem autem maxime, eaque earum perspiciatis nihil laborum quia laudantium, a sit ducimus! Unde!</p>
+
<div class="slider">
 +
  <div class="slides">
 +
<!--radio buttons start-->
 +
<input type="radio" name="radio-btn" id="radio1">
 +
<input type="radio" name="radio-btn" id="radio2">
 +
<input type="radio" name="radio-btn" id="radio3">
 +
<input type="radio" name="radio-btn" id="radio4">
 +
<input type="radio" name="radio-btn" id="radio5">
 +
<!--radio buttons end-->
 +
<!--slide images start-->
 +
<div class="slide first">
 +
  <img class="landing_image overlaying_div_bottom" src="https://static.igem.org/mediawiki/2021/9/96/T--TecCEM--TeamPhotos_4.png">
 +
</div>
 +
<div class="slide">
 +
  <img class="landing_image overlaying_div_bottom" src="https://static.igem.org/mediawiki/2021/9/9f/T--TecCEM--FotoEquipoTexem.jpg">
 +
</div>
 +
<div class="slide">
 +
  <img class="landing_image overlaying_div_bottom" src="https://static.igem.org/mediawiki/2021/9/96/T--TecCEM--TeamPhotos_4.png">
 +
</div>
 +
<div class="slide">
 +
  <img class="landing_image overlaying_div_bottom" src="https://static.igem.org/mediawiki/2021/1/1c/T--TecCEM--logo.png">
 +
</div>
 +
  <div class="slide">
 +
  <img class="landing_image overlaying_div_bottom" src="https://static.igem.org/mediawiki/2021/9/9f/T--TecCEM--FotoEquipoTexem.jpg">
 +
</div>
 +
<!--slide images end-->
 +
<!--automatic navigation start-->
 +
<div class="navigation-auto">
 +
  <div class="auto-btn1"></div>
 +
  <div class="auto-btn2"></div>
 +
  <div class="auto-btn3"></div>
 +
  <div class="auto-btn4"></div>
 +
  <div class="auto-btn5"></div>
 +
</div>
 +
<!--automatic navigation end-->
 +
  </div>
 +
  <!--manual navigation start-->
 +
  <div class="navigation-manual">
 +
<label for="radio1" class="manual-btn"></label>
 +
<label for="radio2" class="manual-btn"></label>
 +
<label for="radio3" class="manual-btn"></label>
 +
<label for="radio4" class="manual-btn"></label>
 +
<label for="radio5" class="manual-btn"></label>
 +
  </div>
 +
  <!--manual navigation end-->
 +
</div>
 
</div>
 
</div>
 +
 
<div class="hidden_colaboration" id="colaboracionrusia" style="background: black;">
 
<div class="hidden_colaboration" id="colaboracionrusia" style="background: black;">
 
<h2>Rushia</h2>
 
<h2>Rushia</h2>
Line 1,686: Line 1,732:
 
});
 
});
 
</script>
 
</script>
 +
 +
<script type="text/javascript">
 +
    var counter = 1;
 +
    setInterval(function(){
 +
      document.getElementById('radio' + counter).checked = true;
 +
      counter++;
 +
      if(counter > 5){
 +
        counter = 1;
 +
      }
 +
    }, 10000);
 +
    </script>
  
 +
<style>
 +
.slider{
 +
  width: 800px;
 +
  height: 500px;
 +
  border-radius: 10px;
 +
  overflow: hidden;
 +
}
 +
 +
.slides{
 +
  width: 500%;
 +
  height: 500px;
 +
  display: flex;
 +
}
 +
 +
.slides input{
 +
  display: none;
 +
}
 +
 +
.slide{
 +
  width: 20%;
 +
  transition: 2s;
 +
}
 +
 +
.slide img{
 +
  width: 800px;
 +
  height: 500px;
 +
}
 +
 +
/*css for manual slide navigation*/
 +
 +
.navigation-manual{
 +
  position: absolute;
 +
  width: 800px;
 +
  margin-top: -40px;
 +
  display: flex;
 +
  justify-content: center;
 +
}
 +
 +
.manual-btn{
 +
  border: 2px solid #40D3DC;
 +
  padding: 5px;
 +
  border-radius: 10px;
 +
  cursor: pointer;
 +
  transition: 1s;
 +
}
 +
 +
.manual-btn:not(:last-child){
 +
  margin-right: 40px;
 +
}
 +
 +
.manual-btn:hover{
 +
  background: #40D3DC;
 +
}
 +
 +
#radio1:checked ~ .first{
 +
  margin-left: 0;
 +
}
 +
 +
#radio2:checked ~ .first{
 +
  margin-left: -20%;
 +
}
 +
 +
#radio3:checked ~ .first{
 +
  margin-left: -40%;
 +
}
 +
 +
#radio4:checked ~ .first{
 +
  margin-left: -60%;
 +
}
 +
#radio5:checked ~ .first{
 +
  margin-left: -80%;
 +
}
 +
 +
/*css for automatic navigation*/
 +
 +
.navigation-auto{
 +
  position: absolute;
 +
  display: flex;
 +
  width: 800px;
 +
  justify-content: center;
 +
  margin-top: 460px;
 +
}
 +
 +
.navigation-auto div{
 +
  border: 2px solid #40D3DC;
 +
  padding: 5px;
 +
  border-radius: 10px;
 +
  transition: 1s;
 +
}
 +
 +
.navigation-auto div:not(:last-child){
 +
  margin-right: 40px;
 +
}
 +
 +
#radio1:checked ~ .navigation-auto .auto-btn1{
 +
  background: #40D3DC;
 +
}
 +
 +
#radio2:checked ~ .navigation-auto .auto-btn2{
 +
  background: #40D3DC;
 +
}
 +
 +
#radio3:checked ~ .navigation-auto .auto-btn3{
 +
  background: #40D3DC;
 +
}
 +
 +
#radio4:checked ~ .navigation-auto .auto-btn4{
 +
  background: #40D3DC;
 +
}
 +
#radio5:checked ~ .navigation-auto .auto-btn5{
 +
  background: #40D3DC;
 +
}
 +
 +
 +
</style>
 
 
 
</html>
 
</html>

Revision as of 02:24, 14 October 2021

Untitled Document i

Home

Team

Project

Awards

Human Practices

Parts

Judging form

Untitled Document

Team

« Back to the whole world

Meetup Latam 2021

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam, doloremque, fugiat. Illum modi tempora fugiat! A, dicta eligendi laborum recusandae, repudiandae, tempore perferendis non nostrum dolor enim ex reiciendis dolore.

Rushia

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magni laboriosam, voluptates veritatis debitis dicta et ratione quidem autem maxime, eaque earum perspiciatis nihil laborum quia laudantium, a sit ducimus! Unde!

idea

Tips

Click on "week"